上一篇: WebPack第二讲------基本配置
https://blog.csdn.net/oracle8090/article/details/106387046
目录
一.全局安装 npm install -g webpack-dev-server
一.全局安装
npm install -g webpack-dev-server
二.项目依赖安装 在项目根目录执行
npm install -D webpack-dev-server
执行的时候报错更换了命令
cnpm install -D webpack-dev-server
三.运行webpack服务器
webpack-dev-server
四.访问地址
五.快捷执行方案
六.关闭刚刚运行的服务器 重新执行命令
发现其实执行的也是webpack-dev-server命令
七.修改服务器配置
参考 https://www.webpackjs.com/configuration/dev-server/
方式一、修改配置文件方式
1.修改访问的根目录
devServer:{
contentBase: path.join(__dirname, "dist")//把dist当做项目的根目录
}
再进行访问直接就到了访问打包目录了
配置服务器的好处就是默认热更新,只要你改了js代码,页面不需要刷新就可以更新展示
2.更改端口
devServer:{
contentBase: path.join(__dirname, "dist"),//把dist当做项目的根目录
host: "0.0.0.0",
port: 8082
}
方式二、修改命令方式
先注释到之前修改的
"start": "webpack-dev-server --content-base dist"
重新关闭服务器运行,服务器又变回原来的8081
3.有些命令只能是命令行传参
加上这个命令就可以看到进度百分比了