Disabling Vite File Hashes

Recently I've been working on a rather large rebuild to my personal, Statamic-powered blog. As part of that rebuild I migrated my build processes to Vite, but ran into an issue where I needed the filenames for my CSS, JavaScript, and assets to remain consistent for compatibility reasons with an existing cache system.

I thought this might be one of those "seems simple but eats eight hours of my day" things, but turns out it was actually incredibly simple. My new vite.config.js file now looks like this:

 1import { defineConfig } from 'vite';
 2import laravel from 'laravel-vite-plugin';
 3 
 4export default defineConfig({
 5    plugins: [
 6        laravel({
 7            input: [
 8                'resources/css/stillat.css',
 9                'resources/js/site.js',
10            ],
11            refresh: true,
12        }),
13    ],
14    build: {
15        rollupOptions: {
16            output: {
17                entryFileNames: `assets/[name].js`,
18                chunkFileNames: `assets/[name].js`,
19                assetFileNames: `assets/[name].[ext]`
20            }
21        }
22    }
23});

Rebuilding my project now produces the file names I wanted 🥳. It turns out Vite uses Rollup to manage this, and it has a wide variety of options for configuring the output:

https://rollupjs.org/configuration-options/

∎