feat: add terser for advanced minification and improve React chunking

- Added terser as a dependency for enhanced code minification.
- Updated Vite configuration to enable aggressive minification using terser with options to drop console logs and unused code.
- Refined manual chunking for React libraries to improve code splitting and loading efficiency.
This commit is contained in:
typist
2025-10-29 09:06:56 +08:00
parent aca7e11835
commit 3e14bc652f
3 changed files with 30 additions and 5 deletions

View File

@@ -44,6 +44,7 @@
"eslint-plugin-react-hooks": "^5.2.0", "eslint-plugin-react-hooks": "^5.2.0",
"eslint-plugin-react-refresh": "^0.4.22", "eslint-plugin-react-refresh": "^0.4.22",
"globals": "^16.4.0", "globals": "^16.4.0",
"terser": "^5.44.0",
"tsx": "^4.19.2", "tsx": "^4.19.2",
"tw-animate-css": "^1.4.0", "tw-animate-css": "^1.4.0",
"typescript": "~5.9.3", "typescript": "~5.9.3",

3
pnpm-lock.yaml generated
View File

@@ -96,6 +96,9 @@ importers:
globals: globals:
specifier: ^16.4.0 specifier: ^16.4.0
version: 16.4.0 version: 16.4.0
terser:
specifier: ^5.44.0
version: 5.44.0
tsx: tsx:
specifier: ^4.19.2 specifier: ^4.19.2
version: 4.20.6 version: 4.20.6

View File

@@ -60,11 +60,15 @@ export default defineConfig({
rollupOptions: { rollupOptions: {
output: { output: {
manualChunks: (id) => { manualChunks: (id) => {
// React核心 // React 核心拆分得更细
if (id.includes('node_modules/react') || if (id.includes('node_modules/react/') && !id.includes('node_modules/react-dom')) {
id.includes('node_modules/react-dom') || return 'react-core';
id.includes('node_modules/react-router-dom')) { }
return 'react-vendor'; if (id.includes('node_modules/react-dom/')) {
return 'react-dom';
}
if (id.includes('node_modules/react-router-dom')) {
return 'react-router';
} }
// Radix UI组件 // Radix UI组件
if (id.includes('node_modules/@radix-ui')) { if (id.includes('node_modules/@radix-ui')) {
@@ -74,9 +78,26 @@ export default defineConfig({
if (id.includes('node_modules/lucide-react')) { if (id.includes('node_modules/lucide-react')) {
return 'icons'; return 'icons';
} }
// 其他工具库
if (id.includes('node_modules/')) {
return 'vendor';
}
}, },
}, },
}, },
// 启用更激进的压缩
minify: 'terser',
terserOptions: {
compress: {
drop_console: true,
drop_debugger: true,
pure_funcs: ['console.log'],
// 移除未使用的代码
unused: true,
// 移除死代码
dead_code: true,
},
},
chunkSizeWarningLimit: 500, chunkSizeWarningLimit: 500,
}, },
}) })