Awesome
<h1 align="center">astro-compressor</h1> <p align="center"> <a href="https://github.com/sondr3/astro-compressor/actions"><img alt="GitHub Actions Status" src="https://github.com/sondr3/astro-compressor/workflows/pipeline/badge.svg" /></a> <a href="https://www.npmjs.com/package/astro-compressor"><img src="https://img.shields.io/npm/v/astro-compressor" alt="npm version"></a> </p> <p align="center"> <b>A gzip and brotli compressor for Astro</b> </p>- Simple: Set it and forget it
- Optimal: By compressing ahead of time, a more performant compression can be performed
Table of Contents
</details>NOTE
- Important: It is vital that this is the last integration in the
integrations
property. Otherwise some files might not get compressed. - Note: This only works for static exports, SSR does not export assets that can be compressed ahead of time so you need to solve it with middleware. See this for more context and a partial solution.
Quickstart
Install via your tool of choice:
# Using NPM
npx astro add astro-compressor
# Using Yarn
yarn astro add astro-compressor
# Using PNPM
pnpm astro add astro-compressor
Then, restart the dev server by typing CTRL-C
and then npm run dev
in the terminal window that was running Astro.
Usage
First, install the package with your favorite package manager: pnpm add --dev astro-compressor
,
then configure it in your astro.config.*
file in the integrations
property:
import { defineConfig } from "astro/config";
import compressor from "astro-compressor";
export default defineConfig({
// ...
integrations: [..., compressor()],
});
Configuration
You can also optionally enable and/or disable either the gzip or brotli compression by passing an options object to the compressor:
import { defineConfig } from "astro/config";
import compressor from "astro-compressor";
export default defineConfig({
// ...
integrations: [..., compressor({ gzip: true, brotli: false })],
});
Or customize the file formats that will be compressed:
import { defineConfig } from "astro/config";
import compressor from "astro-compressor";
export default defineConfig({
// ...
integrations: [..., compressor({
fileExtensions: [".html"] // only compress HTML files
})],
});
By default the fileExtensions
array is [".css", ".js", ".html", ".xml", ".cjs", ".mjs", ".svg", ".txt"]
.
License
MIT.