27_wbpack_自定义Plugin
2024-10-21 09:29:20
Tapable
要想学会自定义Plugin就要先了解Tapable这个库
在我们的wbpack中有两个非常重要的两个类Compiler和Compilation
他们是通过注入插件的方式，来监听webpack 的所有生命周期
在他们的示例中有很多个hooks，而hooks其实是创建了Tapable库中的各种Hook的实例
Tapable有哪些Hook呢？
同步：Sync
- SyncHook
- SyncBailHook
- SyncWaterfallHook
- SyncLoopHook
异步：Async
- Paralle(并行)
- AsyncParallelHook
- AsyncParallelBailHook
- Serise(串行）
- AsyncSeriesHook
- AsyncSeriesBailHook
- AsyncSeriesWaterfallHook
同步和异步的
- 以sync开头的，是同步的Hook
- 以async开头的，两个事件处理回调，不会等待上一次处理回调结束后再执行下一次回调
类别
- bail：当有返回值时，就不会执行后续的事件触发了
- Loop：当返回值为true，就会反复执行该事件，当返回值为undefin或者不返回内容，就退出事件
- Waterfall：当返回值不为undefined时，会将这次返回结果作为下次事件的第一个参数
- Parallel：并行，会同时执行次事件处理回调结束，才执行下一次事件处理回调
- Series：串行，会等待上一是异步的Hook
自定义Plugin
在我们的webpack中有很多的生命周期，我们的插件需要注册到webpack的生命周期当中，那么是如何注册的呢？
- 在webpack函数的createCompiler方法中注册了所有的插件
- 在注册插件的时候会调用插件函数或者插件对象的apply方法
- 插件方法会接收compiler或者compilation对象，我们可以通过compiler或者compilation对象来注册Hook的事件
最新文章
- ajax删除DB数据
- SpringMVC核心分发器DispatcherServlet分析[附带源码分析]
- windows远程控制ubuntu---基于ssh
- Meta标签中的viewport属性及含义
- 关于IOS显示图片的一些注意事项
- Jmeter监控系统等资源，ServerAgent端口的修改
- PE 文件
- eclipse下使用java调用weka（转）
- DNS域欺骗攻击详细教程之Linux篇
- 关于table参数的一些问题
- cadence pcb 设计学习记录提纲
- vue-cli脚手架npm相关文件解读（2）webpack.prod.conf.js
- java课程设计-猜数游戏（201521123029 郑佳明）
- Signal ()函数详细介绍 Linux函数(转）
- 如何卸载wineQQ?
- Git分支操作——查看、新建、删除、提交、合并
- 涂抹mysql笔记-mysql性能调优和诊断
- 更改angular的默认端口
- BZOJ.4946.[NOI2017]蔬菜(贪心 离线)
- ExtJS 4.2 教程-07：Ext.Direct