webpack配置环境变量

借鉴阮一峰老师的再进一步延深：https://github.com/ruanyf/webpack-demos 1、main.js

document.write('<h1>Hello World</h1>'); if (__DEV__) { document.write(new Date()); } if (url != '127.0.0.3') { document.write(url); }

2、在webpack.config.js进行配置

var webpack = require('webpack'); var devFlagPlugin = new webpack.DefinePlugin({ __DEV__: process.env.DEBUG, url: JSON.stringify(process.env.url) != '127.0.0.3' ? JSON.stringify(process.env.url) : '127.0.0.3' }); module.exports = { entry: './main.js', output: { filename: 'bundle.js' }, plugins: [devFlagPlugin] };

3、在package里进行配置

{ "name": "webpack-demo09", "version": "1.0.0", "scripts": { "dev": "npx cross-env DEBUG=true url='127.0.0.1' webpack-dev-server --open", "build": "npx cross-env DEBUG=false url='127.0.0.2' webpack" }, "license": "MIT", "devDependencies": { "webpack": "^4.43.0", "webpack-cli": "^3.3.11", "webpack-dev-server": "^3.11.0" } }

end