webpack插件

webpack 中的插件

通过安装和配置第三方插件，可以扩展webpack的能力，从而让webpack用起来更加方便

• webpack-dev-server
  • 类似于node.js阶段用到的nodemon工具
  • 每当修改了源代码，webpack会自动进行项目的打包和构建
• html-webpack-plugin
  • webpack中的HTML插件（类似于一个模板引擎）
  • 可以通过此插件自定义index.html页面内容

webpack-dev-server

它会启动一个实时打包的http服务器 ，当代码修改时会自动重新打包构建

修改package.json文件中的srcipt节点，

"scripts":{
	"dev":"webpack serve "
}
//之后直接运行npm run dev 来重新进行项目的打包处理

打包配置文件的去向

• 不配置webpack-dev-server的情况下，webpack打包生成的文件会存放在实际的物理磁盘中
  • 严格遵守开发者在webpack.config.js中指定配置
  • 根据output节点指定路径进行存放
• 配置了webpack-dev-server之后，打包生成的文件放在了内存中（默认放在了项目根目录中，虚拟、不可见 导入时 路径是/bundle.js）
  • 不在根据output节点指定的路径，
  • 提高了实时打包输出的性能，因为内存比物理磁盘速度快很多