import VueI18nPlugin from '@intlify/unplugin-vue-i18n/vite'; import { unheadVueComposablesImports } from '@unhead/vue'; import { VantResolver } from '@vant/auto-import-resolver'; import Vue from '@vitejs/plugin-vue'; import VueJsx from '@vitejs/plugin-vue-jsx'; import { dirname } from 'node:path'; import { fileURLToPath, resolve, URL } from 'node:url'; import UnoCSS from 'unocss/vite'; import { type ImportsMap } from 'unplugin-auto-import/types'; import AutoImport from 'unplugin-auto-import/vite'; import { FileSystemIconLoader } from 'unplugin-icons/loaders'; import IconsResolver from 'unplugin-icons/resolver'; import Icons from 'unplugin-icons/vite'; import { TDesignResolver } from 'unplugin-vue-components/resolvers'; import Components from 'unplugin-vue-components/vite'; import VueMacros from 'unplugin-vue-macros/vite'; import Markdown from 'unplugin-vue-markdown/vite'; import { getPascalCaseRouteName, VueRouterAutoImports } from 'unplugin-vue-router'; import VueRouter from 'unplugin-vue-router/vite'; import { createSplitChunkOutput } from 'utils4u/rollup'; import { createViteProxy } from 'utils4u/vite'; import { defineConfig, loadEnv, PluginOption } from 'vite'; import cdnImport from 'vite-plugin-cdn-import'; import { vitePluginFakeServer } from 'vite-plugin-fake-server'; import vueDevTools from 'vite-plugin-vue-devtools'; import { ViteWebfontDownload } from 'vite-plugin-webfont-dl'; // https://vitejs.dev/config/ export default defineConfig(({ mode, command }) => { const isBuild = command === 'build'; const env = loadEnv(mode, process.cwd()); return { base: env.VITE_BASE, plugins: Plugins(), define: { $__DEV__: JSON.stringify(!isBuild), }, resolve: { alias: { '@': fileURLToPath(new URL('./src', import.meta.url)), }, }, server: { proxy: createViteProxy(), }, build: { sourcemap: mode !== 'production' || env.VITE_SOURCE_MAP === 'true', rollupOptions: { onwarn: (warning, warn) => { if (warning.code === 'EMPTY_BUNDLE') return; if (warning.code === 'EVAL' && warning.id?.includes('node_modules/eruda')) return; if (warning.code === 'EVAL' && warning.id?.includes('node_modules/mockjs')) return; warn(warning); }, output: env.VITE_SPLIT_CHUNKS === 'true' ? createSplitChunkOutput() : undefined, }, }, }; }); function Plugins() { const plugins: PluginOption[] = []; plugins.push( VueMacros({ plugins: { vueRouter: VueRouter({ routesFolder: 'src/pages', exclude: ['**/__*', '**/__*/**/*'], getRouteName: (routeNode) => getPascalCaseRouteName(routeNode), logs: false, extensions: ['.vue', '.page.vue', '.md'], }), // https://uvr.esm.is/guide/configuration.html vue: Vue({ include: [/\.vue$/, /\.md$/] }), vueJsx: VueJsx(), // 如有需要 }, }), // https://vue-macros.dev/zh-CN/guide/bundler-integration.html UnoCSS(), Markdown({ headEnabled: true }), ); // TODO: import { Utils4uAutoImports } from 'utils4u'; // https://github.com/unplugin/unplugin-auto-import?tab=readme-ov-file#configuration const Utils4uAutoImports: ImportsMap = { 'utils4u/vue-use': [ // alias ['useCountdown', 'useVueCountdown'], ], }; plugins.push( AutoImport({ resolvers: [TDesignResolver({ library: 'mobile-vue', esm: true }), VantResolver({ importStyle: true })], imports: [ 'vue', 'pinia', '@vueuse/core', VueRouterAutoImports, unheadVueComposablesImports, Utils4uAutoImports, 'vue-i18n', ], }), Components({ // allow auto load markdown components under `./src/components/` extensions: ['vue', 'md'], // allow auto import and register components used in markdown include: [/\.vue$/, /\.vue\?vue/, /\.md$/], resolvers: [ IconsResolver({ prefix: 'icon', customCollections: ['svg'], }), // https://github.com/unplugin/unplugin-icons?tab=readme-ov-file#auto-importing TDesignResolver({ library: 'mobile-vue', esm: true }), VantResolver({ importStyle: true }), ], }), Icons({ autoInstall: true, customCollections: { svg: FileSystemIconLoader('src/assets/icons/svgs', (svg) => { return svg.replace(/^ { plugins.push( // https://github.com/unplugin/unplugin-vue-components/issues/664$0 // https://github.com/VaJoy/vite-plugin-cdn-import-async$0 // https://github.com/mmf-fe/vite-plugin-cdn-import/blob/HEAD/README.zh-CN.md // 会对 Components 插件的自动导入产生影响。 cdnImport({ modules: ['vue'], prodUrl: '//fastly.jsdelivr.net/npm/{name}@{version}/{path}', enableInDevMode: true, }), ); }; return plugins; }