import path from 'node:path' import { execSync } from 'node:child_process' import dayjs from 'dayjs' import { defineConfig, loadEnv } from 'vite' import Uni from '@dcloudio/vite-plugin-uni' // @see https://uni-helper.js.org/vite-plugin-uni-pages import UniPages from '@uni-helper/vite-plugin-uni-pages' // @see https://uni-helper.js.org/vite-plugin-uni-layouts import UniLayouts from '@uni-helper/vite-plugin-uni-layouts' // @see https://github.com/uni-helper/vite-plugin-uni-platform // 需要与 @uni-helper/vite-plugin-uni-pages 插件一起使用 import UniPlatform from '@uni-helper/vite-plugin-uni-platform' // @see https://github.com/uni-helper/vite-plugin-uni-manifest import UniManifest from '@uni-helper/vite-plugin-uni-manifest' // @see https://unocss.dev/ import UnoCSS from 'unocss/vite' import AutoImport from 'unplugin-auto-import/vite' import { visualizer } from 'rollup-plugin-visualizer' import ViteRestart from 'vite-plugin-restart' import uniReadPagesV3Plugin from './src/sheep/router/utils/uni-read-pages-v3' import mpliveMainfestPlugin from './src/sheep/libs/mplive-manifest-plugin' import fs from 'fs' // 读取目录下所有 .scss 文件,并拼接为 import 语句 function getScssImports(dir) { return fs .readdirSync(dir) .filter((file) => file.endsWith('.scss')) .map((file) => `@import "${dir}/${file}";`) .join('\n') } // https://vitejs.dev/config/ export default ({ command, mode }) => { // console.log(mode === process.env.NODE_ENV) // true // mode: 区分生产环境还是开发环境 console.log('command, mode -> ', command, mode) // pnpm dev:h5 时得到 => serve development // pnpm build:h5 时得到 => build production // pnpm dev:mp-weixin 时得到 => build development (注意区别,command为build) // pnpm build:mp-weixin 时得到 => build production // pnpm dev:app 时得到 => build development (注意区别,command为build) // pnpm build:app 时得到 => build production // dev 和 build 命令可以分别使用 .env.development 和 .env.production 的环境变量 const { UNI_PLATFORM } = process.env console.log('UNI_PLATFORM -> ', UNI_PLATFORM) // 得到 mp-weixin, h5, app 等 const env = loadEnv(mode, path.resolve(process.cwd(), 'env')) const { VITE_APP_PORT, VITE_SERVER_BASEURL, VITE_DELETE_CONSOLE, VITE_SHOW_SOURCEMAP, VITE_APP_PROXY, VITE_APP_PROXY_PREFIX, } = env console.log('环境变量 env -> ', env) return defineConfig({ envDir: './env', // 自定义env目录 envPrefix: 'SHOPRO_', plugins: [ UniPages({ exclude: ['**/components/**/**.*', '**/mall/**/**.*'], routeBlockLang: 'json5', // 虽然设了默认值,但是vue文件还是要加上 lang="json5", 这样才能很好地格式化 // homePage 通过 vue 文件的 route-block 的type="home"来设定 // pages 目录为 src/pages,分包目录不能配置在pages目录下 // subPackages: ['src/pages-sub'], // 是个数组,可以配置多个,但是不能为pages里面的目录 dts: 'src/types/uni-pages.d.ts', }), uniReadPagesV3Plugin({ pagesJsonDir: path.resolve(__dirname, './src/pages.json'), includes: ['path', 'aliasPath', 'name', 'meta'], }), mpliveMainfestPlugin(env.SHOPRO_MPLIVE_ON), UniLayouts(), UniPlatform(), UniManifest(), // UniXXX 需要在 Uni 之前引入 Uni(), { // 临时解决 dcloudio 官方的 @dcloudio/uni-mp-compiler 出现的编译 BUG // 参考 github issue: https://github.com/dcloudio/uni-app/issues/4952 // 自定义插件禁用 vite:vue 插件的 devToolsEnabled,强制编译 vue 模板时 inline 为 true name: 'fix-vite-plugin-vue', configResolved(config) { const plugin = config.plugins.find((p) => p.name === 'vite:vue') if (plugin && plugin.api && plugin.api.options) { plugin.api.options.devToolsEnabled = false } }, }, UnoCSS(), AutoImport({ imports: ['vue', 'uni-app'], dts: 'src/types/auto-import.d.ts', dirs: ['src/hooks'], // 自动导入 hooks eslintrc: { enabled: true }, vueTemplate: true, // default false }), ViteRestart({ // 通过这个插件,在修改vite.config.js文件则不需要重新运行也生效配置 restart: ['vite.config.js'], }), // h5环境增加 BUILD_TIME 和 BUILD_BRANCH UNI_PLATFORM === 'h5' && { name: 'html-transform', transformIndexHtml(html) { return html.replace('%BUILD_TIME%', dayjs().format('YYYY-MM-DD HH:mm:ss')) }, }, // 打包分析插件,h5 + 生产环境才弹出 UNI_PLATFORM === 'h5' && mode === 'production' && visualizer({ filename: './node_modules/.cache/visualizer/stats.html', open: true, gzipSize: true, brotliSize: true, }), ], define: { __UNI_PLATFORM__: JSON.stringify(UNI_PLATFORM), __VITE_APP_PROXY__: JSON.stringify(VITE_APP_PROXY), }, css: { preprocessorOptions: { scss: { additionalData: `@import "@/sheep/scss/_var.scss";`, // 确保全局导入你定义的变量文件 }, }, postcss: { plugins: [ // autoprefixer({ // // 指定目标浏览器 // overrideBrowserslist: ['> 1%', 'last 2 versions'], // }), ], }, }, resolve: { alias: { '@': path.join(process.cwd(), './src'), '@img': path.join(process.cwd(), 'src/static/images'), }, }, server: { host: '0.0.0.0', hmr: true, port: Number.parseInt(VITE_APP_PORT, 10), // 仅 H5 端生效,其他端不生效(其他端走build,不走devServer) proxy: JSON.parse(VITE_APP_PROXY) ? { [VITE_APP_PROXY_PREFIX]: { target: VITE_SERVER_BASEURL, changeOrigin: true, rewrite: (path) => path.replace(new RegExp(`^${VITE_APP_PROXY_PREFIX}`), ''), }, } : undefined, }, build: { // 方便非h5端调试 sourcemap: VITE_SHOW_SOURCEMAP === 'true', // 默认是false target: 'es6', // 开发环境不用压缩 minify: mode === 'development' ? false : 'terser', terserOptions: { compress: { drop_console: VITE_DELETE_CONSOLE === 'true', drop_debugger: true, }, }, }, }) }