webpack4多页面配置，生成html静态文件，清除dis
webpack4搭建多页面demo
webpack版本号：4.26.1
填坑之旅 1.webpack4 Cannot find module '@babel/core'原因"babel-loader": "^8.0.0" 版本问题。
使用"babel-loader": "^7.1.5"即可解决该错误。
2.extract-text-webpack-plugin插件提取单独打包css文件时，报错原因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'
]
},
]
}
3.html-webpack-plugin 中使用 title等选项设置模版中的值无效
原因html-loader与html-webpack-plugin冲突,html-loader直接把 <%= htmlWebpackPlugin.options.title %>解析成字符串
利用ejs模板的语法来动态插入各自页面的thunk和css样式可解决
4. postcss 配置不正确导致postcss-loader无效,无法自动添加css前缀postcss.config.js的配置如下
module.exports = {
plugins: [
require('autoprefixer')({
browsers: ['cover 99.5% in CN']
})
]
}
版权声明：
1、该文章(资料)来源于互联网公开信息，我方只是对该内容做点评，所分享的下载地址为原作者公开地址。2、网站不提供资料下载，如需下载请到原作者页面进行下载。
