first

build/plugins/autoImport.ts

@@ -0,0 +1,13 @@
+/**
+ * @name AutoImportPlugin
+ * @description 按需加载，自动引入
+ */
+import AutoImport from 'unplugin-auto-import/vite';
+
+export const AutoImportPlugin = () => {
+  return AutoImport({
+    imports: ['vue', 'uni-app', 'pinia'],
+    dts: 'types/auto-imports.d.ts',
+    vueTemplate: true,
+  });
+};

build/plugins/cleanImage.ts

@@ -0,0 +1,12 @@
+/**
+ * @name CleanImagePlugin
+ * @description 清除构建后的图片资源
+ */
+import CleanBuild from 'vite-plugin-clean-build';
+
+export const CleanImagePlugin = () => {
+  return CleanBuild({
+    outputDir: 'dist/build/mp-weixin',
+    patterns: ['static/images/**', '!static/images/logo.png', '!static/images/tabbar/**'],
+  });
+};

build/plugins/component.ts

@@ -0,0 +1,11 @@
+/**
+ * @name AutoComponentsPlugin
+ * @description 按需加载，自动引入
+ */
+import Components from 'unplugin-vue-components/vite';
+
+export const AutoComponentsPlugin = () => {
+  return Components({
+    dts: 'types/components.d.ts',
+  });
+};

build/plugins/index.ts

@@ -0,0 +1,43 @@
+/**
+ * @name createVitePlugins
+ * @description 封装plugins数组统一调用
+ */
+import type { PluginOption } from 'vite';
+import UniPlugin from '@dcloudio/vite-plugin-uni';
+import ViteRestart from 'vite-plugin-restart';
+import { AutoImportPlugin } from './autoImport';
+// import { ConfigImageminPlugin } from './imagemin';
+// import { ReplaceUrlPlugin } from './replaceUrl';
+import { AutoComponentsPlugin } from './component';
+import { UnoCSSPlugin } from './unocss';
+
+export default function createVitePlugins(isBuild: boolean) {
+  const vitePlugins: (PluginOption | PluginOption[])[] = [
+    // UnoCSS配置
+    UnoCSSPlugin(),
+    // 自动按需引入依赖
+    AutoImportPlugin(),
+    // 自动按需引入组件(注意：需注册至 uni 之前，否则不会生效)
+    AutoComponentsPlugin(),
+    // uni支持(兼容性写法，当type为module时，必须要这样写)
+    (UniPlugin as any).default(),
+    ViteRestart({
+      // 通过这个插件，在修改vite.config.js文件则不需要重新运行也生效配置
+      restart: ['vite.config.ts'],
+    }),
+  ];
+
+  if (isBuild) {
+    const buildPlugins: (PluginOption | PluginOption[])[] = [
+      // 图片资源自动转换为网络资源
+      // ReplaceUrlPlugin(),
+      // 自动清除本地图片
+      // CleanImagePlugin(),
+      // 打包视图分析
+      // VisualizerPlugin(),
+    ];
+    vitePlugins.push(...buildPlugins);
+  }
+
+  return vitePlugins;
+}

build/plugins/mcp.ts

@@ -0,0 +1,9 @@
+/**
+ * @name MCPPlugin
+ * @description MCP服务
+ */
+import { VueMcp } from 'vite-plugin-vue-mcp';
+
+export const MCPPlugin = () => {
+  return VueMcp();
+};

build/plugins/replaceUrl.ts

@@ -0,0 +1,13 @@
+/**
+ * @name ReplaceUrlPlugin
+ * @description 替换图片地址
+ */
+import replaceImageUrl from 'vite-plugin-replace-image-url';
+
+export const ReplaceUrlPlugin = () => {
+  return replaceImageUrl({
+    publicPath: 'https://photo.example.com/miniprogram',
+    sourceDir: 'src/static',
+    verbose: true,
+  });
+};

build/plugins/unocss.ts

@@ -0,0 +1,11 @@
+/**
+ * @name UnoCSSPlugin
+ * @description UnoCSS相关配置
+ */
+import UnoCSS from 'unocss/vite';
+
+export const UnoCSSPlugin = () => {
+  return UnoCSS({
+    mode: 'per-module',
+  });
+};

build/plugins/visualizer.ts

@@ -0,0 +1,13 @@
+/**
+ * @name VisualizerPlugin
+ * @description 打包视图分析
+ */
+import { visualizer } from 'rollup-plugin-visualizer';
+
+export const VisualizerPlugin = () => {
+  return visualizer({
+    emitFile: false,
+    filename: 'stats.html', // 分析图生成的文件名
+    open: true, // 如果存在本地服务端口，将在打包后自动展示
+  });
+};