import { type ConfigEnv, type UserConfig, defineConfig } from 'vite'; import Vue from '@vitejs/plugin-vue'; import { author, copyright } from './package.json'; import Banner from 'vite-plugin-banner'; import Components from 'unplugin-vue-components/vite'; import AutoImport from 'unplugin-auto-import/vite'; import Icons from 'unplugin-icons/vite'; import IconsResolver from 'unplugin-icons/resolver'; import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'; import { resolve } from 'node:path'; import VueDevTools from 'vite-plugin-vue-devtools'; import { cssOption } from './vite/cssOption'; import { rolldownOptions } from './vite/rolldownOptions'; import { useViteCompression } from './vite/compression'; import { FileSystemIconLoader } from 'unplugin-icons/loaders'; import { elementPlusStyleOptimizeIncludes, optimizeIncludes } from './vite/optimizeDeps'; import dayjs from 'dayjs'; import { getPrivateConfig } from './vite/private-config'; import { viteImageminOption } from './vite/viteImageminOption'; import { fileURLToPath } from 'node:url'; const host = process.env.TAURI_DEV_HOST; // 得到个人配置 const privateConfig = getPrivateConfig(); // 添加环境变量 process.env.VITE_DEVICE_ID = privateConfig.deviceID; export default defineConfig(async ({ command }: ConfigEnv): Promise => { /** elementPlus导入的样式是css还是scss */ const elementPlusStyleType: 'css' | 'scss' = 'scss'; /** 是不是生产环境(预览环境也不是生产环境) */ const isBuild = Boolean(command === 'build'); /** 需要预构建的依赖 */ const optimize: string[] = ['mitt', 'element-plus', 'element-plus/es', 'echarts', 'axios', 'simple-keyboard', '@element-plus/icons-vue']; const config: UserConfig = { base: './', // 基础路径 plugins: [ VueDevTools({}), Vue({}), // 自动导入API AutoImport({ dirs: ['./vite/auto-import', './src/pinia/modules'], // 自动导入目录下的模块导出 imports: ['vue', 'vue-router'], vueTemplate: true, // Vue模板内自动导入 dts: './src/types/auto-imports.d.ts', // 当本项目安装 typescript 时是否 生成相应的 .d.ts 文件 [支持自定义路径] 当设置为true时,默认生成文件到'./auto-imports.d.ts'中 resolvers: [ // // 自动导入 Element Plus 相关函数,如:ElMessage, ElMessageBox... (带样式) ElementPlusResolver({ importStyle: elementPlusStyleType === 'scss' ? 'sass' : 'css' }), ], }), // 自动注册组件 Components({ resolvers: [ // 自动导入 Element Plus 组件 ElementPlusResolver({ importStyle: elementPlusStyleType === 'scss' ? 'sass' : 'css' }), // 自动注册图标组件 IconsResolver({ enabledCollections: ['solar', 'pepicons-pencil', 'ph', 'mdi', 'line-md', 'hugeicons', 'lucide', 'fluent', 'streamline-ultimate', 'ep'], customCollections: ['my'], }), ], dts: './src/types/components.d.ts', }), // 注册 svgIcon Icons({ autoInstall: true, compiler: 'vue3', customCollections: { my: FileSystemIconLoader(resolve(__dirname, 'src/assets/svg-icons/unplugin-icons')) }, }), // 压缩 useViteCompression(isBuild), ], resolve: { alias: { '@': fileURLToPath(new URL('./src', import.meta.url)), }, }, css: cssOption(elementPlusStyleType), // css配置 // 预构建 optimizeDeps: { // 需要预构建的依赖 include: isBuild ? [] : [...(await optimizeIncludes(optimize)), ...(await elementPlusStyleOptimizeIncludes(elementPlusStyleType))], }, server: { open: false, // 是否自动打开浏览器 port: 4266, // 开发服务器端口,与Tauri配置一致 strictPort: true, // 设为 true 时若端口已被占用则会直接退出,而不是尝试下一个可用端口。 cors: true, // 为开发服务器配置 CORS。默认启用并允许任何源 host: host || false, hmr: host ? { protocol: 'ws', host, port: 1421 } : undefined, watch: { // 告诉 Vite 忽略监视 `src-tauri` 目录 ignored: ['**/src-tauri/**'], }, // 开发时支持访问所有 HTML 入口 fs: { allow: ['.'], }, }, define: { __APP_VERSION_TIMESTAMP__: JSON.stringify(new Date().getTime()), // 编译时间 'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV), }, // 防止 vite 遮挡掉 rust 语言中的错误信息 clearScreen: false, // 以 `envPrefix` 项开头的环境变量将通过 `import.meta.env` 在 Tauri 的源代码中公开。 envPrefix: ['VITE_', 'TAURI_ENV_*'], build: { outDir: 'dist', // 设置Web部分输出目录 cssCodeSplit: true, // 启用/禁用 CSS 代码拆分。当启用时,在异步 chunk 中导入的 CSS 将内联到异步 chunk 本身,并在其被加载时插入。 如果禁用,整个项目中的所有 CSS 将被提取到一个 CSS 文件中。 target: process.env.TAURI_ENV_PLATFORM === 'windows' ? 'chrome105' : 'safari14', // 设置最终构建的浏览器兼容目标。使用标准 ES 版本代替 Vite 特有的 'modules' chunkSizeWarningLimit: 1150, // 单位kb 打包后文件大小警告的限制 (文件大于此此值会出现警告) assetsInlineLimit: 4096, // 单位字节(1024等于1kb) 小于此阈值的导入或引用资源将内联为 base64 编码,以避免额外的 http 请求。设置为 0 可以完全禁用此项。 minify: !process.env.TAURI_ENV_DEBUG ? 'oxc' : false, reportCompressedSize: false, // 启用/禁用 gzip 压缩大小报告。压缩大型输出文件可能会很慢,因此禁用该功能可能会提高大型项目的构建性能。 // 在 debug 构建中生成 sourcemap sourcemap: Boolean(process.env.TAURI_ENV_DEBUG), rolldownOptions: { ...rolldownOptions(), // 生产环境只构建主入口,开发环境构建所有入口以支持多窗口 input: isBuild ? { main: resolve(__dirname, 'index.html'), } : { main: resolve(__dirname, 'index.html'), 'floating-list-window': resolve(__dirname, 'floating-list-window.html'), 'popup-window': resolve(__dirname, 'popup-window.html'), }, }, }, }; if (isBuild) { /** 添加版权信息 */ const tannerText = `/** * 版权: ${copyright} * 作者: ${author} * 日期: ${dayjs().format('YYYY年MM月DD日')} */`; config.plugins?.push(Banner(tannerText)); // 打包自动压缩图片 config.plugins?.push(viteImageminOption()); } return Promise.resolve(config); });