利用插件机制横向扩展webpack构建能力
webpack插件机制是为了增强webpack在项目自动化构建方面的能力(解决除loader资源模块打包外的其他自动化工作)
常见应用场景:
-
实现自动在打包之前清除
dist目录,clean-webpack-plugin每次打包都会覆盖到
dist目录,只能覆盖同名文件,需要配置output.path -
自动生成应用所需的
HTML文件,html-webpack-plugin在
html中自动注入webpack打包生成的bundle 根据不同环境为代码注入类似
API地址这种可能变化的部分拷贝不需要参与打包的资源文件到输出目录,
copy-webpack-plugin压缩
webpack打包完成后输出的文件自动发布打包结果到服务器实现自动部署
开发一个插件
webpack的插件机制是软件开发中最常见的钩子机制(类似web中的事件)
在webpack整个工作过程有很多环节,便于插件的扩展,webpack在每个环节都埋下一颗钩子,这样开发插件的时候,通过往这些节点挂在不同的任务,就可以轻松扩展webpack的能力
需求:清除webpack打包结果的注释
探索webpack运行机制和核心工作原理
了解webpack整个工作过程细节 (查阅代码) 例子