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 { fileURLToPath, URL } from 'node:url'; import UnoCSS from 'unocss/vite'; 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 { defineConfig, loadEnv, PluginOption } from 'vite'; import cdnImport from 'vite-plugin-cdn-import'; 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)), }, }, build: { sourcemap: mode !== 'production' || env.VITE_SOURCE_MAP === 'true', rollupOptions: { onwarn: (warning, warn) => { if (warning.code === 'EMPTY_BUNDLE') return; if (warning.code === 'EVAL' && warning.message.includes('node_modules/.pnpm/eruda')) 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 }), ); plugins.push( AutoImport({ resolvers: [ TDesignResolver({ library: 'mobile-vue', esm: true, }), VantResolver({ importStyle: true, }), ], imports: ['vue', 'pinia', '@vueuse/core', VueRouterAutoImports, unheadVueComposablesImports], }), 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; }