vite.config.ts 2.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129
  1. import { resolve } from 'path';
  2. import type { UserConfig, Plugin as VitePlugin } from 'vite';
  3. import visualizer from 'rollup-plugin-visualizer';
  4. import { modifyVars } from './build/config/glob/lessModifyVars';
  5. import { setupBasicEnv } from './build/config/vite/env';
  6. import { createProxy } from './build/config/vite/proxy';
  7. import { createMockServer } from 'vite-plugin-mock';
  8. import PurgeIcons from 'vite-plugin-purge-icons';
  9. import { isDevFn, isReportMode, isProdFn, loadEnv } from './build/utils';
  10. setupBasicEnv();
  11. const { VITE_USE_MOCK, VITE_PORT, VITE_PUBLIC_PATH, VITE_PROXY } = loadEnv();
  12. function pathResolve(dir: string) {
  13. return resolve(__dirname, '.', dir);
  14. }
  15. const rollupPlugins: any[] = [];
  16. const vitePlugins: VitePlugin[] = [];
  17. (() => {
  18. if (isReportMode() && isProdFn()) {
  19. // report
  20. rollupPlugins.push(
  21. visualizer({ filename: './node_modules/.cache/stats.html', open: true }) as Plugin
  22. );
  23. }
  24. if (isDevFn() && VITE_USE_MOCK) {
  25. // open mock
  26. vitePlugins.push(
  27. createMockServer({
  28. ignore: /^\_/,
  29. mockPath: 'mock',
  30. })
  31. );
  32. }
  33. })();
  34. const viteConfig: UserConfig = {
  35. /**
  36. * 端口号
  37. * @default '3000'
  38. */
  39. port: VITE_PORT,
  40. /**
  41. * 服务地址
  42. * @default 'localhost'
  43. */
  44. hostname: 'localhost',
  45. /**
  46. * 运行自动打开浏览器·
  47. * @default 'false'
  48. */
  49. open: false,
  50. /**
  51. * 压缩代码
  52. * boolean | 'terser' | 'esbuild'
  53. * @default 'terser'
  54. */
  55. minify: isDevFn() ? false : 'terser',
  56. /**
  57. * 基本公共路径
  58. * @default '/'
  59. */
  60. base: VITE_PUBLIC_PATH,
  61. /**
  62. * 打包输入路径
  63. * @default 'dist'
  64. */
  65. outDir: 'dist',
  66. /**
  67. * @default 'false'
  68. */
  69. sourcemap: false,
  70. /**
  71. * 资源输出路径
  72. * @default '_assets'
  73. */
  74. assetsDir: '_assets',
  75. /**
  76. * 静态资源小于该大小将会内联,默认4096kb
  77. * @default '4096'
  78. */
  79. assetsInlineLimit: 4096,
  80. /**
  81. * esbuild转换目标。
  82. * @default 'es2019'
  83. */
  84. esbuildTarget: 'es2019',
  85. silent: false,
  86. // 别名
  87. alias: {
  88. '/@/': pathResolve('src'),
  89. },
  90. // define: {
  91. // __ENV__: 'value',
  92. // },
  93. // css预处理
  94. cssPreprocessOptions: {
  95. less: {
  96. modifyVars: modifyVars,
  97. javascriptEnabled: true,
  98. },
  99. },
  100. // 配置Dep优化行为
  101. // 会使用 rollup 对 包重新编译,将编译成符合 esm 模块规范的新的包放入 node_modules 下的 .
  102. optimizeDeps: {
  103. include: [
  104. 'echarts',
  105. 'echarts/map/js/china',
  106. 'ant-design-vue/es/locale/zh_CN',
  107. '@ant-design/icons-vue',
  108. 'moment/locale/zh-cn',
  109. ],
  110. },
  111. // 本地跨域代理
  112. proxy: createProxy(VITE_PROXY),
  113. plugins: [PurgeIcons(), ...vitePlugins],
  114. rollupOutputOptions: {},
  115. rollupInputOptions: {
  116. plugins: rollupPlugins,
  117. },
  118. };
  119. export default viteConfig;