plugins.ts 2.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677
  1. import vue from "@vitejs/plugin-vue";
  2. import { pathResolve } from "./utils";
  3. import { viteBuildInfo } from "./info";
  4. import svgLoader from "vite-svg-loader";
  5. import Icons from "unplugin-icons/vite";
  6. import type { PluginOption } from "vite";
  7. import vueJsx from "@vitejs/plugin-vue-jsx";
  8. import tailwindcss from "@tailwindcss/vite";
  9. import { configCompressPlugin } from "./compress";
  10. import removeNoMatch from "vite-plugin-router-warn";
  11. import { visualizer } from "rollup-plugin-visualizer";
  12. import removeConsole from "vite-plugin-remove-console";
  13. import VueI18nPlugin from "@intlify/unplugin-vue-i18n/vite";
  14. import { codeInspectorPlugin } from "code-inspector-plugin";
  15. import { vitePluginFakeServer } from "vite-plugin-fake-server";
  16. export async function getPluginsList(
  17. VITE_CDN: boolean,
  18. VITE_COMPRESSION: ViteCompression
  19. ): Promise<PluginOption[]> {
  20. const lifecycle = process.env.npm_lifecycle_event;
  21. return [
  22. tailwindcss(),
  23. vue({
  24. template: {
  25. compilerOptions: {
  26. isCustomElement: tag => tag === "deep-chat"
  27. }
  28. }
  29. }),
  30. // jsx、tsx语法支持
  31. vueJsx(),
  32. VueI18nPlugin({
  33. // 必须用绝对路径,否则 createFilter 无法匹配 Vite 的绝对文件路径
  34. include: [pathResolve("../locales/**").replace(/\\/g, "/")]
  35. }),
  36. /**
  37. * 在页面上按住组合键时,鼠标在页面移动即会在 DOM 上出现遮罩层并显示相关信息,点击一下将自动打开 IDE 并将光标定位到元素对应的代码位置
  38. * Mac 默认组合键 Option + Shift
  39. * Windows 默认组合键 Alt + Shift
  40. * 更多用法看 https://inspector.fe-dev.cn/guide/start.html
  41. */
  42. codeInspectorPlugin({
  43. bundler: "vite",
  44. hideConsole: true
  45. }),
  46. viteBuildInfo(),
  47. /**
  48. * 开发环境下移除非必要的vue-router动态路由警告No match found for location with path
  49. * 非必要具体看 https://github.com/vuejs/router/issues/521 和 https://github.com/vuejs/router/issues/359
  50. * vite-plugin-router-warn只在开发环境下启用,只处理vue-router文件并且只在服务启动或重启时运行一次,性能消耗可忽略不计
  51. */
  52. removeNoMatch(),
  53. vitePluginFakeServer({
  54. logger: false,
  55. include: "mock",
  56. infixName: false,
  57. enableProd: true
  58. }),
  59. // svg组件化支持
  60. svgLoader(),
  61. // 自动按需加载图标
  62. Icons({
  63. compiler: "vue3",
  64. scale: 1
  65. }),
  66. VITE_CDN ? (await import("./cdn")).cdn : null,
  67. configCompressPlugin(VITE_COMPRESSION),
  68. // 线上环境删除console
  69. removeConsole({ external: ["src/assets/iconfont/iconfont.js"] }),
  70. // 打包分析
  71. lifecycle === "report"
  72. ? visualizer({ open: true, brotliSize: true, filename: "report.html" })
  73. : (null as any)
  74. ];
  75. }