webpack4搭建多页面demo
4.26.1
原因"babel-loader": "^8.0.0" 版本问题。
使用"babel-loader": "^7.1.5"即可解决该错误。
原因webpack4改用mini-css-extract-plugin打包
const miniCssExtractPlugin = require("mini-css-extract-plugin");
module: {
rules: [
{
test:/\.css$/,
use:[
{
loader: 'style-loader',
},
{
loader: miniCssExtractPlugin.loader,
options:{
publicPath: '../'
}
},
'css-loader','postcss-loader'
]
},
]
}
原因html-loader与html-webpack-plugin冲突,html-loader直接把 <%= htmlWebpackPlugin.options.title %>解析成字符串
利用ejs模板的语法来动态插入各自页面的thunk和css样式可解决
postcss.config.js的配置如下
module.exports = {
plugins: [
require('autoprefixer')({
browsers: ['cover 99.5% in CN']
})
]
}