How do I make my Nuxt app (v3) serve .mjs.br (brotli) files instead of the regular .mjs files? (Text compression)

I deployed a simple Nuxt (version 3) app over Google Cloud Run and tested the performance using Lighthouse. The score was pretty horrible but one of the most impactful improvements it offered was to enable text compression (gzip or brotli).

I was able to make the server output .mjs.br files implementing vite-plugin-compression in the nuxt config:

import viteCompression from "vite-plugin-compression";

export default defineNuxtConfig({
  vite: {
    plugins: [viteCompression({ algorithm: "brotliCompress" })],
  },
...

Despite .mjs.br files being generated, .mjs files were still being served by default.

How can I make Nuxt serve the brotli-compressed files instead? Or is this not possible yet?

Solution

Nuxt 3.0.0-rc.9 supports compression out of the box (though there seems to be still bugs surrounding static site generation https://github.com/nuxt/framework/issues/7197).

nuxt.config.ts:

import { defineNuxtConfig } from 'nuxt'

export default defineNuxtConfig({
  nitro: {
    compressPublicAssets: true,
  },
})