适用于 umi 3.x

1. 安装依赖
2. yarn add @tastien/umi-preset-esbuild -D --registry http://npm.tastientech.com/
3. 修改 package.json 启动命令 "start":"cross-env REACT_APP_ENV=test umi vite:dev"
4. 修改 umi 配置 config/config.ts 或 .umirc.ts 增加 vite 配置 （此 vite 和 vite.config 大致相同，需要定制可参考 vite 官网） export default defineConfig({ commonjsModules:['@umijs/plugin-locale','fast-deep-equal/index.js'], vite:{ include:['react','antd','sentry','@umijs/plugin-locale'], optimizeDeps:{}, } }) [图片]

注意事项

1. Umi config 如果有配置 esbuild: {} 需要去掉
2. 如果修改 config 下的文件或 package.json 需要手动重启
3. 报错解决
4. [图片] 在 config/config.ts commonjsModules 配置增加相应模块 [图片]
5. tailwindcss 样式错乱 config/config.ts 配置了额外插件如 extraPostCSSPlugins: [require('postcss-import'), require('tailwindcss')], 修改对应 vite 配置

vite: { css: { postcss: { plugins: [require('postcss-import'), require('tailwindcss')], }, }, } 5. 如有个别项目 dev server 时依赖环境变量，可在 config/config.ts 自行配置如：

1. 因为使用 json 解析 define key 的值需要字符串 '"value"' vite: { define: { 'process.env.REACT_APP_ENV': '"test"', }, },