vite.config.js 3.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119
  1. import legacyPlugin from '@vitejs/plugin-legacy'
  2. import AutoImport from 'unplugin-auto-import/vite'
  3. import Components from 'unplugin-vue-components/vite'
  4. import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
  5. import { viteLogo } from './src/core/config'
  6. import Banner from 'vite-plugin-banner'
  7. import * as path from 'path'
  8. import * as dotenv from 'dotenv'
  9. import * as fs from 'fs'
  10. import vuePlugin from '@vitejs/plugin-vue'
  11. import GvaPosition from './vitePlugin/gvaPosition'
  12. import GvaPositionServer from './vitePlugin/codeServer'
  13. import fullImportPlugin from './vitePlugin/fullImport/fullImport.js'
  14. // @see https://cn.vitejs.dev/config/
  15. export default ({
  16. command,
  17. mode
  18. }) => {
  19. const NODE_ENV = mode || 'development'
  20. const envFiles = [
  21. `.env.${NODE_ENV}`
  22. ]
  23. for (const file of envFiles) {
  24. const envConfig = dotenv.parse(fs.readFileSync(file))
  25. for (const k in envConfig) {
  26. process.env[k] = envConfig[k]
  27. }
  28. }
  29. viteLogo(process.env)
  30. const timestamp = Date.parse(new Date())
  31. const optimizeDeps = {}
  32. const alias = {
  33. '@': path.resolve(__dirname, './src'),
  34. 'vue$': 'vue/dist/vue.runtime.esm-bundler.js',
  35. }
  36. const esbuild = {}
  37. const rollupOptions = {
  38. output: {
  39. entryFileNames: 'js/087AC4D233B64EB0[name].js',
  40. chunkFileNames: 'js/087AC4D233B64EB0[name].js',
  41. assetFileNames: 'assets/087AC4D233B64EB0[name].[ext]',
  42. },
  43. }
  44. const config = {
  45. base: './', // index.html文件所在位置
  46. root: './', // js导入的资源路径,src
  47. resolve: {
  48. alias,
  49. },
  50. define: {
  51. 'process.env': {}
  52. },
  53. server: {
  54. // 如果使用docker-compose开发模式,设置为false
  55. open: true,
  56. port: process.env.VITE_CLI_PORT,
  57. proxy: {
  58. // 把key的路径代理到target位置
  59. // detail: https://cli.vuejs.org/config/#devserver-proxy
  60. [process.env.VITE_BASE_API]: { // 需要代理的路径 例如 '/api'
  61. target: `${process.env.VITE_BASE_PATH}:${process.env.VITE_SERVER_PORT}/`, // 代理到 目标路径
  62. changeOrigin: true,
  63. rewrite: path => path.replace(new RegExp('^' + process.env.VITE_BASE_API), ''),
  64. }
  65. },
  66. },
  67. build: {
  68. minify: 'terser', // 是否进行压缩,boolean | 'terser' | 'esbuild',默认使用terser
  69. manifest: false, // 是否产出manifest.json
  70. sourcemap: false, // 是否产出sourcemap.json
  71. outDir: 'dist', // 产出目录
  72. rollupOptions,
  73. },
  74. esbuild,
  75. optimizeDeps,
  76. plugins: [
  77. GvaPositionServer(),
  78. GvaPosition(),
  79. legacyPlugin({
  80. targets: ['Android > 39', 'Chrome >= 60', 'Safari >= 10.1', 'iOS >= 10.3', 'Firefox >= 54', 'Edge >= 15'],
  81. }),
  82. vuePlugin(),
  83. [Banner(`\n Build based on gin-vue-admin \n Time : ${timestamp}`)]
  84. ],
  85. css: {
  86. preprocessorOptions: {
  87. scss: {
  88. additionalData: `@use "@/style/element/index.scss" as *;`,
  89. }
  90. }
  91. },
  92. }
  93. if (NODE_ENV === 'development') {
  94. config.plugins.push(
  95. fullImportPlugin()
  96. )
  97. } else {
  98. config.plugins.push(AutoImport({
  99. resolvers: [ElementPlusResolver()]
  100. }),
  101. Components({
  102. resolvers: [ElementPlusResolver({
  103. importStyle: 'sass'
  104. })]
  105. }))
  106. }
  107. return config
  108. }