This Astro integration brings compression utilities to
your Astro project.
csso html-minifier-terser terser
Installation
There are two ways to add integrations to your project. Let's try the most
convenient option first!
(experimental) 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 astro-compress
, run the following from your project directory and
follow the prompts:
npx astro add astro-compress
yarn astro add astro-compress
pnpx astro add astro-compress
Install dependencies manually
First, install the astro-compress
integration like so:
npm install astro-compress
Then, apply this integration to your astro.config.*
file using the
integrations
property:
astro.config.mjs
import { defineConfig } from "astro/config";
import compress from "astro-compress";
export default defineConfig({
integrations: [compress()],
});
Getting started
The utility should now automatically compress all your CSS, HTML and JavaScript
files in the dist folder.
You can override any of the default options from the configurations of:
or disable them entirely:
import { defineConfig } from "astro/config";
import compress from "astro-compress";
export default defineConfig({
integrations: [
compress({
css: false,
html: false,
js: false,
}),
],
});
If your path is different than dist be sure to update it accordingly:
import { defineConfig } from "astro/config";
import compress from "astro-compress";
export default defineConfig({
outDir: "./build",
integrations: [
compress({
path: "./build",
}),
],
});