import { defineConfig,loadEnv } from 'vite'; import react from '@vitejs/plugin-react-swc'; import monacoEditorPlugin from 'vite-plugin-monaco-editor'; import viteCompression from 'vite-plugin-compression'; import { visualizer } from 'rollup-plugin-visualizer'; export default defineConfig(({mode})=> { const env = loadEnv(mode, process.cwd(), ''); // 如果你用的ts,请使用 let define: { [key: string]: string } = {}; let define = {}; Object.keys(env).forEach(key => { define[`import.meta.env.${key}`] = JSON.stringify(env[key]) }) return { base: './', plugins: [ react(), { name: 'less', apply: 'build', loaders: ['less-loader'] }, monacoEditorPlugin({ languageWorkers: ['editorWorkerService'] }), visualizer({ open:true, // 注意这里要设置为true,否则无效,如果存在本地服务端口,将在打包后自动展示 gzipSize:true, file: "stats.html", //分析图生成的文件名 brotliSize:true }), viteCompression({ filter: /\.(js|css|json|txt|ico|svg)(\?.*)?$/i, verbose: true, // 是否在控制台中输出压缩结果 disable: false, threshold: 1024, // 如果体积大于500kb,将被压缩,单位为b,体积过小时请不要压缩,以免适得其反 algorithm: 'gzip', // 压缩算法,可选['gzip',' brotliccompress ','deflate ','deflateRaw'] ext: '.gz', deleteOriginFile: false // 源文件压缩后是否删除 }) ], build: { outDir: 'dist', // 打包文件 默认dist minify: 'terser', chunkSizeWarningLimit: 2000, // 文件大小,默认500kb,生成的一个或多个文件的大小超过该值时,Vite 会发出警告提示 // 打包清除console和debugger terserOptions: { compress: { drop_console: true, drop_debugger: true } }, }, server: { host: '0.0.0.0',// 监听所有地址 port: 5173, // 默认端口 https: false, // 是否开启 https open: false, // 项目启动时是否打开浏览器 cors: true, // 为开发服务器配置 CORS。默认启用并允许任何源,传递一个 选项对象 来调整行为或设为 false 表示禁用。 base: '/', // 用于代理 Vite 作为子文件夹时使用。 headers: {}, // 指定服务端响应的headers信息 strictPort: false, // 设为 true 时若端口已被占用则会直接退出,而不是尝试下一个可用端口。 proxy: { // 当有 /api开头的地址是,代理到target地址 '^/api': { target: 'http://172.20.2.23:18084/', //目标源,目标服务器,真实请求地址 //target: 'http://192.168.2.211:9080/', //目标源,目标服务器,真实请求地址 changeOrigin: true, //支持跨域 rewrite: (path) => path.replace(/^\/api/, "/api"), //重写真实路径,替换/api } }, }, } })