先下载一个cross-env模块，比较好控制环境
npm install cross-env
在package.json中写入环境的配置
"scripts": {
"dev": "cross-env NODE_ENV=dev nuxt --open ",
"test": "cross-env NODE_ENV=test nuxt",
"build": "cross-env NODE_ENV=pro nuxt build",
"start": "cross-env NODE_ENV=pro nuxt start",
"generate": "nuxt generate"
},
1
2
3
4
5
6
7
在nuxt.config.js同级目录创建一个env.js文件,写入想要的配置
module.exports = {
// 开发环境
dev: {
NODE_ENV: 'development',
// 统一登录
LOGIN_URL: 'http://xxx',
// 请求前缀
BASE_PREFIX: '/dev-api',
// 代理的后端请求服务器地址
SERVER_URL: 'https://xxx.xxx',
// 前端系统跑的端口
SYSTEM_PORT: '8888'
},
// 测试环境
test: {
NODE_ENV: 'test',
// 统一登录
LOGIN_URL: 'http://xxx',
// 请求前缀
BASE_PREFIX: '/test-api',
// 代理的后端请求服务器地址
SERVER_URL: 'https://xxx.xxx',
// 前端系统跑的端口
SYSTEM_PORT: '8888'
},
// 生产环境
pro: {
NODE_ENV: 'production',
// 统一登录
LOGIN_URL: 'http://xxx',
// 请求前缀
BASE_PREFIX: '/prod-api',
// 代理的后端请求服务器地址
SERVER_URL: 'https://xxx.xxx',
// 前端系统跑的端口
SYSTEM_PORT: '8888'
}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
在nuxt.config.js中的env模块中设置环境变量
引入env
import env from './env'
1
env模块
//nuxt.config.js中
// 环境变量
env: {
NODE_ENV: env[process.env.NODE_ENV].NODE_ENV,
// 统一登录 process.env.authURL
LOGIN_URL: env[process.env.NODE_ENV].LOGIN_URL,
// 请求前缀
BASE_PREFIX: env[process.env.NODE_ENV].BASE_PREFIX,
// 请求服务器地址
SERVER_URL: env[process.env.NODE_ENV].SERVER_URL,
// 前端系统的端口
SYSTEM_PORT: env[process.env.NODE_ENV].SYSTEM_PORT
},
1
2
3
4
5
6
7
8
9
10
11
12
13
在其他地方直接通过process.env.xxx用
