webpack 核心编译器 十七 节

  • Compilation.prototype.factorizeModule 的重载与注册方式。

  • 移除的旧 API 接口 modifyHashcache,并通过 util.deprecate 提示开发者使用新的方式。

  • 一系列的 PROCESS_ASSETS_STAGE_* 常量,用于定义在资源处理流程中的不同阶段。

数值的含义 这些常量是阶段的"优先级权重",Webpack 会按 数值从小到大排序执行钩子函数(Hook) ,因此:

  • 数值小:阶段越靠前,越早执行。
  • 数值大:阶段越靠后,越晚执行。
js 复制代码
/**
 * @typedef {object} FactorizeModuleOptions
 * @property {ModuleProfile=} currentProfile 当前模块的性能分析信息(可选)
 * @property {ModuleFactory} factory 模块工厂实例
 * @property {Dependency[]} dependencies 要因式分解的依赖数组
 * @property {boolean=} factoryResult 是否返回完整的 ModuleFactoryResult(默认为只返回 module)
 * @property {Module | null} originModule 源模块(即谁引用了这些依赖)
 * @property {Partial<ModuleFactoryCreateDataContextInfo>=} contextInfo 上下文信息(可选)
 * @property {string=} context 模块因式分解时使用的上下文路径(可选)
 */

/**
 * 因式分解模块:将依赖转换为模块。
 * @param {FactorizeModuleOptions} options 配置项对象
 * @param {ModuleCallback | ModuleFactoryResultCallback} callback 回调函数
 * @returns {void}
 */

// 由于 TypeScript 不支持类中使用 JSDoc 进行函数重载,这里用了一种绕过方式
/* eslint-disable jsdoc/require-asterisk-prefix */
Compilation.prototype.factorizeModule = /**
	 @type {{
	(options: FactorizeModuleOptions & { factoryResult?: false }, callback: ModuleCallback): void;
	(options: FactorizeModuleOptions & { factoryResult: true }, callback: ModuleFactoryResultCallback): void;
}} */ (
		function (options, callback) {
			this.factorizeQueue.add(options, callback); // 添加到因式分解队列中,异步处理
		}
	);
/* eslint-enable jsdoc/require-asterisk-prefix */

// 用于隐藏某些属性(例如过时的属性)不被 TypeScript 检测
const compilationPrototype = Compilation.prototype;

// TODO webpack 6 删除:废弃接口 modifyHash
Object.defineProperty(compilationPrototype, "modifyHash", {
	writable: false,
	enumerable: false,
	configurable: false,
	value: () => {
		throw new Error(
			"Compilation.modifyHash 被移除,请改用 Compilation.hooks.fullHash"
		);
	}
});

// TODO webpack 6 删除:废弃接口 cache
Object.defineProperty(compilationPrototype, "cache", {
	enumerable: false,
	configurable: false,
	get: util.deprecate(
		/**
		 * @this {Compilation} 当前 compilation 实例
		 * @returns {Cache} 缓存对象
		 */
		function () {
			return this.compiler.cache; // 实际调用 compiler 上的 cache
		},
		"Compilation.cache 已被移除,请使用 Compilation.getCache()",
		"DEP_WEBPACK_COMPILATION_CACHE"
	),
	set: util.deprecate(
		/**
		 * @param {any} v 设置值(忽略)
		 */
		v => { },
		"Compilation.cache 已被移除,请使用 Compilation.getCache()",
		"DEP_WEBPACK_COMPILATION_CACHE"
	)
});

/**
 * 添加额外资源的阶段。
 */
Compilation.PROCESS_ASSETS_STAGE_ADDITIONAL = -2000;

/**
 * 资源预处理阶段。
 */
Compilation.PROCESS_ASSETS_STAGE_PRE_PROCESS = -1000;

/**
 * 基于现有资源派生新资源。
 * 现有资源不应视为最终完成。
 */
Compilation.PROCESS_ASSETS_STAGE_DERIVED = -200;

/**
 * 向现有资源中添加额外内容,例如版权头部或初始化代码。
 */
Compilation.PROCESS_ASSETS_STAGE_ADDITIONS = -100;

/**
 * 一般性优化资源,例如格式统一等。
 */
Compilation.PROCESS_ASSETS_STAGE_OPTIMIZE = 100;

/**
 * 优化资源数量,例如合并资源(同类型资源)。
 * 不同类型资源合并应使用 PROCESS_ASSETS_STAGE_OPTIMIZE_INLINE。
 */
Compilation.PROCESS_ASSETS_STAGE_OPTIMIZE_COUNT = 200;

/**
 * 优化资源的兼容性,例如添加 polyfill 或厂商前缀。
 */
Compilation.PROCESS_ASSETS_STAGE_OPTIMIZE_COMPATIBILITY = 300;

/**
 * 优化资源体积,例如压缩、删除多余空白等。
 */
Compilation.PROCESS_ASSETS_STAGE_OPTIMIZE_SIZE = 400;

/**
 * 为资源添加开发工具支持,例如提取 source map。
 */
Compilation.PROCESS_ASSETS_STAGE_DEV_TOOLING = 500;

/**
 * 优化资源数量,例如将资源内联到其他资源中(适用于不同类型资源)。
 */
Compilation.PROCESS_ASSETS_STAGE_OPTIMIZE_INLINE = 700;

/**
 * 总结资源列表,例如生成 Service Worker 的资源清单。
 */
Compilation.PROCESS_ASSETS_STAGE_SUMMARIZE = 1000;

/**
 * 优化资源的哈希值,例如根据内容生成真实哈希。
 */
Compilation.PROCESS_ASSETS_STAGE_OPTIMIZE_HASH = 2500;

/**
 * 优化资源传输,例如预生成压缩文件(gzip)。
 */
Compilation.PROCESS_ASSETS_STAGE_OPTIMIZE_TRANSFER = 3000;

/**
 * 分析现有资源。
 */
Compilation.PROCESS_ASSETS_STAGE_ANALYSE = 4000;

/**
 * 创建用于报告的资源,例如构建报告、体积分析等。
 */
Compilation.PROCESS_ASSETS_STAGE_REPORT = 5000;

module.exports = Compilation;
相关推荐
abigale038 分钟前
webpack+vite前端构建工具 -11实战中的配置技巧
前端·webpack·node.js
专注API从业者28 分钟前
构建淘宝评论监控系统:API 接口开发与实时数据采集教程
大数据·前端·数据库·oracle
Joker`s smile31 分钟前
Chrome安装老版本、不同版本,自制便携版本用于前端调试
前端·chrome
weixin_4166399734 分钟前
爬虫工程师Chrome开发者工具简单介绍
前端·chrome·爬虫
我是如子啊39 分钟前
【解决“此扩展可能损坏”】Edge浏览器(chrome系列通杀))扩展损坏?一招保留数据快速修复
前端·chrome·edge
灵性花火39 分钟前
Qt的前端和后端过于耦合(0/7)
开发语言·前端·qt
孤水寒月5 小时前
基于HTML的悬窗可拖动记事本
前端·css·html
祝余呀5 小时前
html初学者第一天
前端·html
耶啵奶膘7 小时前
uniapp+firstUI——上传视频组件fui-upload-video
前端·javascript·uni-app
视频砖家8 小时前
移动端Html5播放器按钮变小的问题解决方法
前端·javascript·viewport功能