您的位置:首页 > Web前端 > Webpack

webpack-dev-server 热更新 配置

2018-01-16 11:08 761 查看
vue+webpack 前端开发中,有时运行npm run dev不能自动热更新,查了一下,终于解决了,主要原因还是对webpack不了解。
问题描述:
1.npm run dev后,修改项目文件后, 没有自动更新编译,需要手动再执行npm run dev。
2.自动打开的浏览器内容不会自动更新。

问题解决:
1.config/index.js  修改dev中poll选项值为true(或时间)。
2.build/webpack.dev.conf.js 修改devServer中hot选项值为true。

原因:
1.查看build/webpack.dev.conf.js下devServer的配置信息,有一项是watchOptions(可查看webpack文档),是webpack文件变化监听的一些配置。vue init webpack xxx 构建的新项目默认只有一个poll选项,poll选项的作用在文档中有说明:



而devServer的配置中,该值为config.dev.poll:
     


查看config/index.js发现该值为false,也就是polling没有开启,修改为true即可。config/index.js有很多其他的配置,比如devServer端口号、是否自动打开浏览器等。
-----------------------
一个大点的项目devServer跑起来可能会在几十秒左右,有了热更新可以很快更新修改,效率提升不少呢。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: