4.devserver
webpack-dev-server 为你提供了一个简单的 web 服务器,并且能够实时重新加载(live reloading)。
4.1.安装webpack-dev-server
npm install webpack-dev-server --save-dev
修改package.json配置文件,在script选项中加入下面代码:
"start": "webpack-dev-server",
整个package.json配置文件如下:
{ ?"name": "code", ?"version": "1.0.0", ?"description": "", ?"main": "index.js", ?"scripts": { ???"dev": "./node_modules/webpack/bin/webpack.js", ???"start": "webpack-dev-server", ???"test": "echo \"Error: no test specified\" && exit 1" ?}, ?"keywords": [], ?"author": "", ?"license": "ISC", ?"devDependencies": { ???"html-webpack-plugin": "^2.30.1", ???"webpack": "^3.10.0" ?}}
在终端运行命令:
npm start
命令启动后,通过http://localhost:8080/ 访问
4.2.让工具自动给我们打开服务器地址
在webpack.config.js中添加配置
devServer:{ ???open: true}
其中open:true 表示自动打开浏览器
4.3.修改服务器端口
在webpack.config.js中添加配置项目
devServer:{ ???open: true, ???port: 8090}
其中port后面给一个自定义端口
4.4.设置默认访问目录
devServer:{ ???open: true, ???port: 8090, ???contentBase: ‘./dist‘}
webpack最佳入门实践系列(4)
原文地址:https://www.cnblogs.com/nodeing/p/8808590.html