共计 825 个字符，预计需要花费 3 分钟才能阅读完成。
webpack4 配置文件分离
webpack 根据开发和生成环境一般可以将配置文件拆分，拆分 dev 和 prod 两种环境
|- package.json
|- /build
|- webpack.base.js
|- webpack.dev.js
|- webpack.prod.js
在 scripts 里修改相应的命令
“dev”: “webpack-dev-server –config build/webpack.dev.js”,
“build”: “webpack –config build/webpack.prod.js”
使用 webpack-merge, 用以合并通用配置文件与开发环境配置文件
// webpack.dev.js
const path = require(‘path’);
const webpack = require(‘webpack’);
const merge = require(‘webpack-merge’);
const baseWebpackConfig = require(‘./webpack.base’);
module.exports = merge(baseWebpackConfig, {
mode: ‘development’,
devServer: {
host: ‘127.0.0.1’,
port: 80,
contentBase: path.join(__dirname, ‘dist’),
open: false,
hot: false,
disableHostCheck: true,
proxy: {},
before () {}
},
plugins: [
// 启用 HMR
new webpack.HotModuleReplacementPlugin({})
]
});
// webpack.prod.js
const baseWebpackConfig = require(‘./webpack.base’);
module.exports = merge(baseWebpackConfig, {
mode: ‘production’
});
