🔧 chore: Enhance Vite configuration with improved environment variable handling and chunking strategies

This commit is contained in:
Ruben Talstra 2025-02-27 16:34:16 +01:00
parent b46c0ed43f
commit 2fa8d40d11
No known key found for this signature in database
GPG key ID: 2A5A7174A60F3BEA

View file

@ -24,6 +24,7 @@ export default defineConfig({
},
},
},
// Set the directory where environment variables are loaded from and restrict prefixes
envDir: '../',
envPrefix: ['VITE_', 'SCRIPT_', 'DOMAIN_', 'ALLOW_'],
plugins: [
@ -31,10 +32,10 @@ export default defineConfig({
react(),
tailwindcss(),
VitePWA({
injectRegister: 'auto',
registerType: 'autoUpdate',
injectRegister: 'auto', // 'auto' | 'manual' | 'disabled'
registerType: 'autoUpdate', // 'prompt' | 'autoUpdate'
devOptions: {
enabled: false,
enabled: false, // disable service worker registration in development mode
},
useCredentials: true,
workbox: {
@ -85,7 +86,7 @@ export default defineConfig({
compression({
verbose: true,
disable: false,
threshold: 10240,
threshold: 10240, // compress files larger than 10KB
algorithm: 'gzip',
ext: '.gz',
}),
@ -97,32 +98,42 @@ export default defineConfig({
minify: 'terser',
rollupOptions: {
preserveEntrySignatures: 'strict',
// external: ['uuid'],
output: {
manualChunks(id: string) {
if (id.includes('node_modules')) {
// Group Radix UI libraries together.
if (id.includes('@radix-ui')) {
return 'radix-ui';
}
// Group framer-motion separately.
if (id.includes('framer-motion')) {
return 'framer-motion';
}
// Group markdown-related libraries.
if (id.includes('node_modules/highlight.js')) {
return 'markdown_highlight';
}
if (id.includes('node_modules/hast-util-raw') || id.includes('node_modules/katex')) {
return 'markdown_large';
}
// Group TanStack libraries together.
if (id.includes('@tanstack')) {
return 'tanstack-vendor';
}
// Additional grouping for other node_modules:
if (id.includes('@headlessui')) {
return 'headlessui';
}
// Everything else falls into a generic vendor chunk.
return 'vendor';
}
// Create a separate chunk for all locale files under src/locales.
if (id.includes(path.join('src', 'locales'))) {
return 'locales';
}
// Let Rollup decide automatically for any other files.
return null;
},
entryFileNames: 'assets/[name].[hash].js',
@ -134,6 +145,10 @@ export default defineConfig({
return 'assets/[name].[hash][extname]';
},
},
/**
* Ignore "use client" waning since we are not using SSR
* @see {@link https://github.com/TanStack/query/pull/5161#issuecomment-1477389761 Preserve 'use client' directives TanStack/query#5161}
*/
onwarn(warning, warn) {
if (warning.message.includes('Error when using sourcemap')) {
return;
@ -161,6 +176,7 @@ export function sourcemapExclude(opts?: SourcemapExclude): Plugin {
if (opts?.excludeNodeModules && id.includes('node_modules')) {
return {
code,
// https://github.com/rollup/rollup/blob/master/docs/plugin-development/index.md#source-code-transformations
map: { mappings: '' },
};
}