(如转载,请注明出处)
1.安装Webpack-dev-server
Use webpack with a development server that provides live reloading. This should be used for development only
Webpack-dev-server 提供热重载,应该仅在开发模式下使用
获取历史版本
npm view webpack-dev-server versions
安装命令
npm i webpack-dev-server@x.x.x -D (x.x.x为版本号)
安装完成后,我们将package.json中 scripts: { dev: 'webpack -d watch' }改为 scripts: { dev: 'webpack-dev-server' };
webpack.config.json中的path改为:
var path = require('path');
然后运行npm run dev后会发现页面可以热重载了, 是不是很爽?!
使用webpack和webpack-dev-server的区别,使用webpack运行时会首先把开发文件更新到生产文件,而webpack-dev-server时并不会主动关联到生产文件,而是直接输出到视图。
为了给webpack-dev-server定制配置,我们需要去webpack.config.js,创建一个新选项devServer:
更多配置可参见webpack.js.org.
网友评论