webpack開發或打包多環境配置

項目開發流程一般流程可能有開發和生產，但是也會有測試和預發，這樣四個環境下。npn run dev 或者
npm run build 時就需要對應不同環境。

如此增加一個環境參數env_config 分別在dev.env.js 和prod.env.js

var merge = require('webpack-merge');
var prodEnv = require('./prod.env');

module.exports = merge(prodEnv, {
	NODE_ENV: '"development"',
	env_config: '"' +process.env.env_config+ '"'
});

module.exports = {
	NODE_ENV: '"production"',
	env_config: '"' +process.env.env_config+ '"'
};

對應npm 命令

    "dev:dev": "cross-env env_config=dev node build/dev-server.js",
    "dev:pro": "cross-env env_config=pro node build/dev-server.js",
    "dev:pre": "cross-env env_config=pre node build/dev-server.js",
    "dev:test": "cross-env env_config=test node build/dev-server.js",
    "build:dev": "cross-env env_config=dev node build/build.js",
    "build:pro": "cross-env env_config=pro node build/build.js",
    "build:pre": "cross-env env_config=pre node build/build.js",
    "build:test": "cross-env env_config=test node build/build.js"

當然 npm -i cross-env --dev-save

就可以實現諸如不同環境的域名
domainconfig.js

module.exports = {
    domain: function() {
        let environment = process.env.env_config;
        if (environment == 'test') {
            return 'https://www.test.com'
        } else if (environment == 'pre') {
            return 'https://www.pre.com'
        } else if (environment == 'pro') {
            return 'https://www.pro.com'
        } else if (environment== 'dev') {
            return 'https://www.dev.com'
        }
    }
}

代理配置等

var path = require('path');
var domain = require('../domainconfig/index');

module.exports = {
	
	dev: {
		env: require('./dev.env'),
		port: 3333,
		https:true,
		autoOpenBrowser: true,
		assetsSubDirectory: 'static',
		assetsPublicPath: '/',
		host: '127.0.0.1',
		proxyTable: {
			'/api': {
			  target: domain.domain(),
			  changeOrigin: true,  //是否跨域
			  pathRewrite: {
				'^/api': '/api',
			  }
			},
		},
	
		cssSourceMap: true
	},
	externalsCss_dev:[
	
	],
	externalsCss_prod: [
	
	],
	externalsJs_dev:[
	
	],
	externalsJs_prod: [
	
	],
	title: '' //模板標題
};

如此執行 npm run dev:pre