最近呢也是学到了黑马vue里面的webpack，然后接触到了webpack-dev-server这个插件，在此对其进行一定的总结
①安装此插件（需在项目根目录中打开powershell小黑屋）
npm install webpack-dev-server -D
②配置webpack-dev-server: 1)打开package.json这个包管理文件 2）找到scripts这个节点，将里面的dev属性值改为
"scripts": {"dev": "webpack serve"}
3）在此运行npm run dev命令，重新进行项目打包，打包成功后，会出现如下代码：
在安装和配置完server配置后，每次我们对我们修改后的代码进行保存的时候，server都会对我们的代码进行重新打包，然后此时，我们想要进入我们的项目文件也变了一个方式，不再是之前的Alt+B或者open in other browser，而是ctrl+鼠标左键点击
[wds] Project ...http://XXXX:8080//这个链接
进去之后，会出现跟我们项目目录一样的页面
因为我的html文件保存于src，所以单击src即可进入
除此之外，可能有些小伙伴就会发现，我们对html文件进行样式修改之后，点击src进去发现并没有发现修改后的样式
那么这时就来到了我们的正题：server原理： webpack-dev-server插件的的确确是会将我们修改并进行保存的文件进行自动打包，然而它并不会将修改后的代码挂载到出口文件中，也就是它并不会将代码放入我们肉眼可见的项目中的文件中，例如说：
我这里的output出口文件设置为dist目录下的，以bundle.js为名的js文件下，然而server插件并不会将修改后的代码挂载到我们机械硬盘中的bundle这个文件里面，而是会被放入内存中的（我们肉眼看不见）的‘隐形’bundle.js文件中
看我们的终端第二行：
这里显示webpack的出口为一个/，说明就是放于内存中的隐形文件中了，我们这时候只需要将原html页面中引入的js文件改为
<script src="/bundle.js"></script>
即可
