vite.config.js 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157
  1. /*
  2. * @Author: yufp
  3. * @Date: 2024-03-25 10:33:01
  4. * @LastEditors: zhanglin3
  5. * @LastEditTime: 2024-10-17 17:42:03
  6. * @Description: 定义开发和构建的配置
  7. */
  8. import { resolve } from 'path';
  9. import { defineConfig, loadEnv } from 'vite';
  10. import vue2 from '@vitejs/plugin-vue2';
  11. import vue2Jsx from '@vitejs/plugin-vue2-jsx';
  12. import { viteExternalsPlugin } from 'vite-plugin-externals';
  13. // 引入svg需要用到的插件, 安装 yarn add vite-plugin-svg-icons
  14. import { createSvgIconsPlugin } from 'vite-plugin-svg-icons';
  15. // 导入低码代理配置和忽略编译配置
  16. import { getProxyConfig } from './build-proxy';
  17. import insertYuxpProxy from './src/config/yuxp/proxyConfig.js';
  18. // 根据运行模式加载环境变量,并配置Vite
  19. export default ({ mode }) => {
  20. // 加载环境变量
  21. const loadEnvVar = loadEnv(mode, process.cwd());
  22. const {
  23. VITE_APP_DEV_PORT,
  24. VITE_APP_BASE_URL,
  25. } = loadEnvVar;
  26. const proxy = getProxyConfig(loadEnvVar, insertYuxpProxy);
  27. const viteHost = '0.0.0.0';
  28. // 判断是否为开发模式
  29. const isDev = mode === 'development';
  30. // 返回Vite配置对象
  31. return defineConfig({
  32. define: {
  33. 'process.env': {},
  34. },
  35. base: VITE_APP_BASE_URL, // 设置项目基路径
  36. plugins: [
  37. vue2(),
  38. vue2Jsx(),
  39. createSvgIconsPlugin({
  40. // 配置svg图标
  41. iconDirs: [
  42. resolve(process.cwd(), 'src/style/svg'),
  43. resolve(process.cwd(), 'src/views/@xdjf/card/style/svg'),
  44. resolve(process.cwd(), 'src/views/@xdjf/intelligent-due-diligence/assets/icons/svg'),
  45. resolve(process.cwd(), 'src/views/@xdjf/intelligent-due-diligence/assets/icons/chatSvg'),
  46. resolve(process.cwd(), 'src/views/@xdjf/financial-analysis/assets/icons/svg'),
  47. ],
  48. symbolId: 'icon-[name]',
  49. }),
  50. // 生产模式下使用 externals
  51. !isDev && viteExternalsPlugin({
  52. echarts: 'echarts',
  53. }),
  54. ].filter(Boolean), // 过滤掉 false 值
  55. resolve: {
  56. alias: {
  57. package: resolve(__dirname, 'package.json'),
  58. 'yuxp-web': resolve('src'),
  59. assets: resolve(__dirname, 'src/assets'),
  60. static: resolve(__dirname, 'public/static'),
  61. '@': resolve(__dirname, 'src'), // 设置别名为src目录
  62. '@xdjf/demo-web': resolve(__dirname, 'src/views/@xdjf/demo-web'),
  63. '@xdjf/card': resolve(__dirname, 'src/views/@xdjf/card'),
  64. '@xdjf/idd': resolve(__dirname, 'src/views/@xdjf/intelligent-due-diligence'), // 智能尽调
  65. '@xdjf/fa': resolve(__dirname, 'src/views/@xdjf/financial-analysis'), // 财务分析
  66. vue: resolve('node_modules/vue/dist/vue.esm.js'),
  67. '@yufp/store': resolve(__dirname, 'node_modules/@yufp/store/vuex/'),
  68. },
  69. // 省略后缀
  70. extensions: ['.vue', '.js', '.json', '.ts'],
  71. },
  72. // scss全局变量的配置
  73. css: {
  74. preprocessorOptions: {
  75. scss: {
  76. additionalData: '@import "./src/style/variables.scss";',
  77. },
  78. },
  79. },
  80. optimizeDeps: {
  81. // 其他常用依赖
  82. include: [
  83. 'vue',
  84. 'echarts',
  85. 'vue-router',
  86. 'vuex',
  87. 'element-ui',
  88. 'axios',
  89. 'lodash',
  90. // shuffle 集成
  91. 'codemirror/addon/selection/active-line',
  92. 'codemirror/addon/hint/show-hint',
  93. 'codemirror/addon/edit/matchbrackets',
  94. 'codemirror/addon/edit/closebrackets',
  95. 'codemirror/mode/javascript/javascript',
  96. 'codemirror/mode/sql/sql',
  97. 'codemirror/lib/codemirror',
  98. ],
  99. esbuildOptions: {
  100. target: 'es2015',
  101. },
  102. exclude: ['@ggzj/shuffle-lite-web'],
  103. },
  104. server: {
  105. // 服务器配置
  106. port: VITE_APP_DEV_PORT, // 设置开发服务器端口号
  107. host: viteHost, // 监听所有网络接口
  108. cors: true, // 启用跨域请求
  109. proxy: proxy, // 使用定义的代理规则
  110. // 优化热更新配置
  111. hmr: {
  112. overlay: false, // 关闭错误遮罩,提高响应速度
  113. },
  114. // 优化文件监听配置
  115. watch: {
  116. // 使用数组形式的忽略规则,性能更好
  117. ignored: [
  118. '**/node_modules/**',
  119. '**/.git/**',
  120. '**/dist/**',
  121. '**/coverage/**',
  122. '**/*.log',
  123. '**/.temp/**',
  124. '**/.cache/**',
  125. '**/public/**',
  126. '**/.vscode/**',
  127. '**/.idea/**',
  128. ],
  129. // 使用原生监听,提高性能
  130. usePolling: false,
  131. // 增加防抖延迟,减少频繁触发
  132. interval: 500,
  133. },
  134. },
  135. build: {
  136. // 构建配置
  137. target: 'es2015', // 设置目标浏览器兼容版本
  138. sourcemap: false, // 是否生成源码映射
  139. chunkSizeWarningLimit: 2000, // 设置块大小警告限制
  140. reportCompressedSize: false, // 是否报告压缩后的大小
  141. // 开发模式下禁用压缩,提高构建速度
  142. minify: isDev ? false : 'terser',
  143. cssMinify: !isDev,
  144. terserOptions: {
  145. compress: {
  146. drop_debugger: true,
  147. drop_console: true,
  148. },
  149. },
  150. },
  151. });
  152. };