开发服务器&自动化

每次修改代码后都需要手动执行打包命令效率太低了，我们希望代码保存后可以自动重新编译

1. 下载包

bash

npm i webpack-dev-server -D

2. 配置

修改 webpack.config.js

js

export default {
  //其他配置...
  devServer: { // 开发服务器
    host: 'localhost', // 地址
    port: '2800', // 端口
    open: true // 是否立刻打开
  },
}

3. 运行指令

bash

npx webpack serve

通过配置开发服务器实现：
- 代码保存自动重新编译
- 浏览器自动刷新（无需手动刷新）
- 模块热替换(HMR) 只更新修改的模块，保持应用状态

并且使用开发服务器时，所有代码都会在内存中编译打包，并不会输出到 dist 目录下