webpack学习笔记（四）—— 如何让webpack监听代码编辑，进行自动打包编译

使用webpack-dev-server这个工具，来是实现自动打包编译的功能

1. 运行 `npm i webpack-dev-server -D`把这个工具安装到项目的本地开发依赖

2安装完毕后，这个工具的用法和webpack命令的用法完全一样

3由于我们是在项目中安装的webpack-dev-server，所以无法把他当作脚本命令，在powershell终端中直接运行（只有那些安装到全局 -g 的工具，才能在终端中正常执行）

4 webpack-dev-server这个工具如果想要正常运行，要求，在本地项目中，必须安装webpack【 `npm i -D`】

5在package.json,增加scripts的属性

"dev":"webpack-dev-server"

6 控制台输入命令

npm run dev

 注：

webpack-dev-server帮我们打包生成的bundle.js文件，并没有放到实际的物理磁盘上，而是，直接托管到了电脑的内存中，所以我们在项目中。根本找不到这个打包好的bundle.js

我们可以认为，webpack-dev-server把打包好的文件一一种虚拟的形式，托管到了咱们项目的根目录中，虽然我们看不到它，但是，可以认为，和dist   src  nodle_moudles 平级，有一个看不见的文件叫做 bundle.js

为什么要这么做

因为物理硬盘的转速是固定的，硬盘再快也没有内存中快 ，避免了磁盘的消耗，速度还很快

和dist src node_moudles 平级，