136 lines
3.7 KiB
TypeScript
136 lines
3.7 KiB
TypeScript
import tailwindcss from '@tailwindcss/vite';
|
||
import react from '@vitejs/plugin-react';
|
||
import path, { resolve } from 'path';
|
||
import { defineConfig, loadEnv } from 'vite';
|
||
import cesiumPlugin from 'vite-plugin-cesium';
|
||
import { viteStaticCopy } from "vite-plugin-static-copy";
|
||
|
||
// ============================================================
|
||
// Vite 配置 - 性能优化版
|
||
// - 代码分包 (manualChunks)
|
||
// - 路径别名
|
||
// - CSS 代码分割
|
||
// ============================================================
|
||
|
||
const ENV = { DEV: 'development', PROD: 'production' };
|
||
|
||
export default defineConfig(({ mode }) => {
|
||
const env = loadEnv(mode, '.', '');
|
||
return {
|
||
|
||
plugins: [
|
||
react(),
|
||
tailwindcss(),
|
||
|
||
cesiumPlugin(), viteStaticCopy({
|
||
targets: [
|
||
{
|
||
src: "node_modules/cesium/Build/Cesium",
|
||
dest: ""
|
||
}
|
||
]
|
||
})
|
||
|
||
],
|
||
|
||
resolve: {
|
||
alias: {
|
||
'@': resolve('src'),
|
||
},
|
||
},
|
||
|
||
// ---- 性能优化构建配置 ----
|
||
build: {
|
||
// 启用 CSS 代码分割（避免样式重复打包）
|
||
cssCodeSplit: true,
|
||
// 生成 sourcemap（生产可关闭）
|
||
sourcemap: false,
|
||
// chunk 大小警告阈值
|
||
chunkSizeWarningLimit: 1000, // KB
|
||
|
||
rollupOptions: {
|
||
output: {
|
||
// ---- 手动分包策略 ----
|
||
// 将第三方库按类型拆分，利于浏览器并行加载与长期缓存
|
||
//manualChunks(id) {
|
||
// if (!id.includes('node_modules')) return;
|
||
|
||
// // 1. React 生态
|
||
// if (
|
||
// id.includes('node_modules/react') ||
|
||
// id.includes('node_modules/react-dom') ||
|
||
// id.includes('node_modules/react-router') ||
|
||
// id.includes('node_modules/react-redux') ||
|
||
// id.includes('node_modules/@reduxjs') ||
|
||
// id.includes('node_modules/scheduler')
|
||
// ) {
|
||
// return 'react-vendor';
|
||
// }
|
||
|
||
// // 2. Ant Design 组件库
|
||
// if (
|
||
// id.includes('node_modules/antd') ||
|
||
// id.includes('node_modules/@ant-design') ||
|
||
// id.includes('node_modules/@rc-component') ||
|
||
// id.includes('node_modules/rc-')
|
||
// ) {
|
||
// return 'antd-vendor';
|
||
// }
|
||
|
||
// // 3. 图表库（echarts / recharts 体积较大）
|
||
// if (
|
||
// id.includes('node_modules/echarts') ||
|
||
// id.includes('node_modules/recharts') ||
|
||
// id.includes('node_modules/zrender')
|
||
// ) {
|
||
// return 'charts-vendor';
|
||
// }
|
||
|
||
// // 4. 实时音视频 SDK
|
||
// if (
|
||
// id.includes('node_modules/agora-rtc-sdk-ng') ||
|
||
// id.includes('node_modules/@volcengine/rtc')
|
||
// ) {
|
||
// return 'rtc-vendor';
|
||
// }
|
||
|
||
// // 5. 仅在特定页面使用的重库，单独拆分按需加载（不进首屏 vendor）
|
||
// if (id.includes('node_modules/mqtt')) return 'mqtt-vendor';
|
||
// if (id.includes('node_modules/socket.io-client')) return 'socket-vendor';
|
||
// if (id.includes('node_modules/docx')) return 'docx-vendor';
|
||
// if (id.includes('node_modules/qrcode')) return 'qrcode-vendor';
|
||
// if (id.includes('node_modules/country-state-city')) return 'csc-vendor';
|
||
// if (id.includes('node_modules/flv.js')) return 'flv-vendor';
|
||
|
||
// // 6. 其他 node_modules（首屏通用依赖：axios、i18next、lodash 等）
|
||
// return 'vendor';
|
||
//},
|
||
},
|
||
},
|
||
},
|
||
|
||
define: {
|
||
// Cesium 路径注入
|
||
CESIUM_BASE_URL: JSON.stringify(
|
||
'/Cesium'
|
||
),
|
||
// 环境变量注入
|
||
'import.meta.env.VITE_API_BASE_URL': JSON.stringify(env.VITE_API_BASE_URL ?? env.baseURL ?? ''),
|
||
'process.env': {}
|
||
},
|
||
|
||
server: {
|
||
port: 5173,
|
||
// HMR
|
||
hmr: process.env.DISABLE_HMR !== 'true',
|
||
|
||
},
|
||
|
||
// ---- 优化用户体验 ----
|
||
esbuild: {
|
||
// 日志中排除特定的包警告
|
||
logOverride: { 'this-is-undefined-in-esm': 'silent' },
|
||
},
|
||
};
|
||
});
|