不同環(huán)境如何配置地址請(qǐng)查看[環(huán)境切換](https://blog.csdn.net/Genius_cxx/article/details/97788044)
1：安裝cross-env
npm i --save-dev cross-env
//npm i --save-dev cross-env? //淘寶鏡像下載
?2：安裝cross-env
在config目錄下創(chuàng)建test.env.js和pre.env.js
- 修改prod.env.js中的內(nèi)容签夭，如下
'use strict'
module.exports = {
NODE_ENV: '"production"',
EVN_CONFIG:'"prod"',
API_ROOT:'"/apis/v1"'
}
- 修改test.env.js和pre.env.js文件內(nèi)容拧篮，如下
test.env.js
'use strict'
module.exports = {
NODE_ENV: '"testing"',
EVN_CONFIG:'"test"',
API_ROOT:'"/test/apis/train"'
}
pre.env.js
'use strict'
module.exports = {
NODE_ENV: '"presentation"',
EVN_CONFIG:'"pre"',
API_ROOT:'"/pre/apis/train"'
}
- 修改dev.env.js文件內(nèi)容拟蜻，如下辉川。
dev環(huán)境配制了服務(wù)代理，API_ROOT前的api是配制的代理地址。
module.exports = merge(prodEnv, {
NODE_ENV: '"development"',
VN_CONFIG: '"dev"',
API_ROOT: '"api/apis/v1"'
})
3：修改package.json文件
- 對(duì)package.json文件中的scrpit內(nèi)容進(jìn)行編輯贱勃，創(chuàng)建不同環(huán)境的打包指令
在這里，NODE_ENV最好都設(shè)成production谤逼，因?yàn)樵趗tils.js只做了production一種判定贵扰，親測(cè)不會(huì)影響各環(huán)境API參數(shù)。
"scripts": {
? "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
? "start": "npm run dev",
? "build": "node build/build.js",
? "build:test": "cross-env NODE_ENV=production env_config=test node build/build.js",
? "build:pre": "cross-env NODE_ENV=production env_config=pre node build/build.js",
? "build:prod": "cross-env NODE_ENV=production env_config=prod node build/build.js"
},
```
##### 4：修改config/index.js文件
- 修改config/index.js文件中build參數(shù)流部，這里參數(shù)會(huì)在build/webpackage.prod.conf.js中使用到戚绕。
```
build:{
? // Template for index.html
? // 添加test pre prod 三處環(huán)境的配制
? prodEnv: require('./prod.env'),
? preEnv: require('./pre.env'),
? testEnv: require('./test.env'),
? //下面為原本的內(nèi)容，不需要做任何個(gè)性
? index:path.resolve(__dirname,'../dist/index.html'),
? ...
?5：在webpackage.pred.conf.js中使用構(gòu)建環(huán)境參數(shù)
- 對(duì)build/webpackage.prod.conf.js文件進(jìn)行修改枝冀，調(diào)整env常量的生成方式舞丛。
// 個(gè)性env常量的定義
// const env = require('../config/prod.env')
const env = config.build[process.env.env_config+'Env']
?6：調(diào)整build/build.js
- 刪除process.env.NODE_ENV的賦值耘子，修改spinner的定義，如下
'use strict'
require('./check-versions')()
// 注釋掉的代碼
// process.env.NODE_ENV = 'production'
const ora = require('ora')
const rm = require('rimraf')
const path = require('path')
const chalk = require('chalk')
const webpack = require('webpack')
const config = require('../config')
const webpackConfig = require('./webpack.prod.conf')
// 修改spinner的定義
// const spinner = ora('building for production...')
var spinner = ora('building for ' + process.env.NODE_ENV + ' of ' + process.env.env_config+ ' mode...' )
spinner.start()
...
