- 使用 React.lazy() + Suspense 实现路由级代码分割 - 配置 manualChunks 将 react/tdesign/recharts 拆分为独立 vendor chunk - 页面组件改为 export default 以支持动态导入 - 新增 bundle-optimization 规范,更新 frontend 导航规范
44 lines
1.0 KiB
TypeScript
44 lines
1.0 KiB
TypeScript
import { defineConfig } from 'vite'
|
|
import react from '@vitejs/plugin-react'
|
|
import path from 'node:path'
|
|
|
|
const vendorChunks: Record<string, string[]> = {
|
|
'vendor-react': ['react', 'react-dom', 'react-router'],
|
|
'vendor-tdesign': ['tdesign-react', 'tdesign-icons-react'],
|
|
'vendor-recharts': ['recharts'],
|
|
}
|
|
|
|
// https://vite.dev/config/
|
|
export default defineConfig({
|
|
plugins: [react()],
|
|
resolve: {
|
|
alias: {
|
|
'@': path.resolve(__dirname, './src'),
|
|
},
|
|
},
|
|
server: {
|
|
proxy: {
|
|
'/api': {
|
|
target: `http://localhost:${process.env.NEX_BACKEND_PORT || '9826'}`,
|
|
changeOrigin: true,
|
|
},
|
|
},
|
|
},
|
|
build: {
|
|
chunkSizeWarningLimit: 700,
|
|
rollupOptions: {
|
|
output: {
|
|
manualChunks(id) {
|
|
for (const [chunkName, modules] of Object.entries(vendorChunks)) {
|
|
for (const mod of modules) {
|
|
if (id.includes(`/node_modules/${mod}/`)) {
|
|
return chunkName
|
|
}
|
|
}
|
|
}
|
|
},
|
|
},
|
|
},
|
|
},
|
|
})
|