webpack采坑指南
准备： webpack官方教程
坑点
- 在完成起步后向管理资源进发，时候你可能会遇到一个错误 Unexpected character
解决方法 ：
如果你页面的title使用的是中文名字的话，那么你会看到页签的显示也乱码了解决方法是在页面中加入编码格式 如下：
<!doctype html>
<html>
<head>
<title>起步</title>
<meta charset="UTF-8">
<script src="https://unpkg.com/lodash@4.16.6"></script>
</head>
<body>
<script src="./src/index.js"></script>
</body>
</html>
- 在管理输出- 清理 /dist文件夹中会遇到一个报错
原因 ： “clean-webpack-plugin”: “^3.0.0” 3.0及以上写法改变了
// 加载
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
// 使用
plugins:[
new CleanWebpackPlugin(),
new HtmlWebpackPlugin({
title: 'Output Management'
})
]
- 热更模块替换这里的坑点就更多了
a) 首先前面用的是 webpack-dev-middleware 形式的服务， 这里直接开讲webpack-dev-server形式的代码， 简直把我想的不要太聪明， 折腾了半天也没搞懂webpack-dev-middleware应该怎么配置，于是把代码按照下面的webpack-dev-server重新写了一遍。热更提换其实主要讲的是代码改变后浏览器的内容会自动更新， 主要是module.hot.accept再起作用，可以将webpack-dev-serve版的代码全部写好后重启服务，然后注释掉代码验证那些是可以更新的。
b) 如果更新了webpack.config.js文件，那么需要重启服务才行
7294
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
