需求:配置dev、test、staging、production 环境,打包使用不同API地址。
import { defineConfig } from 'umi';
export default defineConfig({
define: {
// test 环境的请求基础地址
'process.env.ENV': 'test',
'process.env.API_ROOT': 'http://test.xxx.xx.xx:50000'
},
proxy: { // 本地跨域可配置跨域代理
'/api': {
target: 'http://192.168.0.xxx:50000/',
ws: true,
changeOrigin: true,
pathRewrite: { '^/api': '' },
},
},
});
umirc.staging.ts
import { defineConfig } from 'umi';
export default defineConfig({
define: {
// staging环境的请求基础地址
'process.env.ENV': 'staging',
'process.env.API_ROOT': 'http://staging.xxx.xx.xx:50000'
},
},
});
- 配置启动、打包命令
(1)需要安装 cross-env
yarn add cross-env --dev
(2)在 package.json 配置如下
"start:test": "cross-env UMI_ENV=test umi dev", // 启动命令
"build:test": "cross-env UMI_ENV=test umi build", // test打包命令
"build:staging": "cross-env UMI_ENV=staging umi build",
"build:production": "cross-env UMI_ENV=production umi build",
- Umi-request 使用:
const request = extend({
timeout: 20000,
prefix: process.env.ENV !== 'dev' ? process.env.API_ROOT : '/api',
errorHandler, // 默认错误处理
credentials: 'include', // 默认请求是否带上cookie
});
Tips:【小程序云开发】中高级前端面试题库(源码:小程序中联系我哟)。
---------- 创作不易,感谢大家,请多多支持!