index.ts 3.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103
  1. import { resolve } from 'path'
  2. import Vue from '@vitejs/plugin-vue'
  3. import VueJsx from '@vitejs/plugin-vue-jsx'
  4. import WindiCSS from 'vite-plugin-windicss'
  5. import progress from 'vite-plugin-progress'
  6. import EslintPlugin from 'vite-plugin-eslint'
  7. import PurgeIcons from 'vite-plugin-purge-icons'
  8. import { ViteEjsPlugin } from 'vite-plugin-ejs'
  9. import AutoImport from 'unplugin-auto-import/vite'
  10. import Components from 'unplugin-vue-components/vite'
  11. import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
  12. import viteCompression from 'vite-plugin-compression'
  13. import vueSetupExtend from 'vite-plugin-vue-setup-extend'
  14. import VueI18nPlugin from '@intlify/unplugin-vue-i18n/vite'
  15. import { createSvgIconsPlugin } from 'vite-plugin-svg-icons'
  16. import {
  17. createStyleImportPlugin,
  18. ElementPlusResolve,
  19. VxeTableResolve
  20. } from 'vite-plugin-style-import'
  21. export function createVitePlugins(VITE_APP_TITLE: string) {
  22. const root = process.cwd()
  23. // 路径查找
  24. function pathResolve(dir: string) {
  25. return resolve(root, '.', dir)
  26. }
  27. return [
  28. Vue(),
  29. VueJsx(),
  30. WindiCSS(),
  31. progress(),
  32. PurgeIcons(),
  33. vueSetupExtend(),
  34. AutoImport({
  35. imports: ['vue', 'vue-router', '@vueuse/core'],
  36. dts: 'src/types/auto-imports.d.ts',
  37. resolvers: [ElementPlusResolver()],
  38. eslintrc: {
  39. enabled: false, // Default `false`
  40. filepath: './.eslintrc-auto-import.json', // Default `./.eslintrc-auto-import.json`
  41. globalsPropValue: true // Default `true`, (true | false | 'readonly' | 'readable' | 'writable' | 'writeable')
  42. }
  43. }),
  44. Components({
  45. // 要搜索组件的目录的相对路径
  46. dirs: ['src/components'],
  47. // 组件的有效文件扩展名
  48. extensions: ['vue', 'md'],
  49. // 搜索子目录
  50. deep: true,
  51. include: [/\.vue$/, /\.vue\?vue/],
  52. // 生成自定义 `auto-components.d.ts` 全局声明
  53. dts: 'src/types/auto-components.d.ts',
  54. // 自定义组件的解析器
  55. resolvers: [ElementPlusResolver()],
  56. exclude: [/[\\/]node_modules[\\/]/]
  57. }),
  58. createStyleImportPlugin({
  59. resolves: [ElementPlusResolve(), VxeTableResolve()],
  60. libs: [
  61. {
  62. libraryName: 'element-plus',
  63. esModule: true,
  64. resolveStyle: (name) => {
  65. return `element-plus/es/components/${name.substring(3)}/style/css`
  66. }
  67. },
  68. {
  69. libraryName: 'vxe-table',
  70. esModule: true,
  71. resolveStyle: (name) => {
  72. return `vxe-table/es/${name}/style.css`
  73. }
  74. }
  75. ]
  76. }),
  77. EslintPlugin({
  78. cache: false,
  79. include: ['src/**/*.vue', 'src/**/*.ts', 'src/**/*.tsx'] // 检查的文件
  80. }),
  81. VueI18nPlugin({
  82. runtimeOnly: true,
  83. compositionOnly: true,
  84. include: [resolve(__dirname, 'src/locales/**')]
  85. }),
  86. createSvgIconsPlugin({
  87. iconDirs: [pathResolve('src/assets/svgs')],
  88. symbolId: 'icon-[dir]-[name]',
  89. svgoOptions: true
  90. }),
  91. viteCompression({
  92. verbose: true, // 是否在控制台输出压缩结果
  93. disable: false, // 是否禁用
  94. threshold: 10240, // 体积大于 threshold 才会被压缩,单位 b
  95. algorithm: 'gzip', // 压缩算法,可选 [ 'gzip' , 'brotliCompress' ,'deflate' , 'deflateRaw']
  96. ext: '.gz', // 生成的压缩包后缀
  97. deleteOriginFile: false //压缩后是否删除源文件
  98. }),
  99. ViteEjsPlugin({
  100. title: VITE_APP_TITLE
  101. })
  102. ]
  103. }