+
+
+
+
+
+
+
+astro-compress - v2.1.6
 | |||
 AstroCritters 🦔 AstroJS GoogleChromeLabs Critters integration. Inline your critical CSS with Astro. |     |  AstroRome 🏛️ AstroJS Rome tools. Format, lint and check your Astro website with Rome. |     |
🗜️ AstroCompress
This Astro integration brings compression utilities to +your Astro project.
+CSS / HTML / JavaScript / +Image / SVG
+++Note
++
AstroCompresswill not compress your requests, only your statically +generated build and pre-rendered routes.
++[!IMPORTANT]
+Use
+AstroCompresslast in your integration list for the best optimization.
Installation
There are two ways to add integrations to your project. Let's try the most +convenient option first!
+astro add command
Astro includes a CLI tool for adding first party integrations: astro add. This
+command will:
-
+
- (Optionally) Install all necessary dependencies and peer dependencies +
- (Also optionally) Update your
astro.config.*file to apply this integration
+
To install AstroCompress, run the following from your project directory and
+follow the prompts:
Using NPM:
+npx astro add astro-compress
+Using Yarn:
+yarn astro add astro-compress
+Using PNPM:
+pnpx astro add astro-compress
+Install dependencies manually
First, install the AstroCompress integration like so:
npm install -D -E astro-compress
+Then, apply this integration to your astro.config.* file using the
+integrations property:
astro.config.ts
import Compress from "astro-compress";
export default { integrations: [Compress()] };
+Getting started
The utility will now automatically compress all your CSS, HTML, SVG, JavaScript
+and image files in the Astro outDir folder.
The following image file types will be compressed via sharp:
+-
+
- avci +
- avcs +
- avif +
- avifs +
- gif +
- heic +
- heics +
- heif +
- heifs +
- jfif +
- jif +
- jpe +
- jpeg +
- jpg +
- apng +
- png +
- raw +
- tiff +
- webp +
SVG compression is supported via svgo.
+Default Compression
You can override any of the default options from the configurations of:
+-
+
- csso +
- html-minifier-terser +
- sharp +
- svgo +
- terser +
or disable them entirely:
+astro.config.ts
import Compress from "astro-compress";
export default {
integrations: [
Compress({
CSS: false,
HTML: false,
Image: false,
JavaScript: false,
SVG: false,
}),
],
};
+Adding Multiple Paths
You can add multiple paths to compress by specifying an array as the Path
+variable.
astro.config.ts
import Compress from "astro-compress";
export default {
integrations: [
Compress({
Path: ["./Target", "./Build"],
}),
],
};
+Input-Output Mapping
You can also provide a map of paths for different input output directories.
+astro.config.ts
import Compress from "astro-compress";
export default {
integrations: [
Compress({
Path: new Map([["./Source", "./Target"]]),
}),
],
};
+Or an array of the two.
+astro.config.ts
import Compress from "astro-compress";
export default {
integrations: [
Compress({
Path: [
// Compress Target
"./Target",
// Compress Target one more time into a different directory
new Map([["./Target", "./TargetCompress"]]),
],
}),
],
};
+File Filtering
You can filter files to exclude specific ones from compression. A filter can be +an array of regular expressions or a single match. You can also use functions to +match on file names:
+astro.config.ts
import Compress from "astro-compress";
export default {
integrations: [
Compress({
Exclude: [
"File.png",
(File: string) =>
File === "./Target/Favicon/Image/safari-pinned-tab.svg",
],
}),
],
};
+Controlling Logging
You can control the logging level by setting the Logger parameter. The default
+value is 2, but you can set it to 0 if you don't want to see debug messages:
astro.config.ts
import Compress from "astro-compress";
export default {
integrations: [
Compress({
Logger: 0,
}),
],
};
+Changelog
See CHANGELOG.md for a history of changes to this integration.
+
+
+
\ No newline at end of file
Generated using TypeDoc
biome-ignore lint/suspicious/noExplicitAny:
+