Webpack参考手册
接口 | API
编译器 | Compiler
该Compiler
的WebPack的模块是创建通过的WebPack CLI或途经的所有选项编译实例的主引擎webpack
API或的WebPack配置文件。
它是由webpack
api下输出的webpack.Compiler
。
编译器由webpack通过实例化,然后调用该run
方法来使用。以下是一个可以使用的例子Compiler
。事实上,这与webpack本身如何使用它非常接近。
compiler-example
// Can be imported from webpack package
import {Compiler} from 'webpack';
// Create a new compiler instance
const compiler = new Compiler();
// Populate all required options
compiler.options = {...};
// Creating a plugin.
class LogPlugin {
apply (compiler) {
compiler.plugin('should-emit', compilation => {
console.log('should I emit?');
return true;
})
}
}
// Apply the compiler to the plugin
new LogPlugin().apply(compiler);
/* Add other supporting plugins */
// Callback to be executed after run is complete
const callback = (err, stats) => {
console.log('Compiler has finished execution.');
// Display stats...
};
// call run on the compiler along with the callback
compiler.run(callback);
这Compiler
就是我们所说的Tapable
实例。通过这个,我们的意思是它混合在一起Tapable
来吸收功能来注册和调用插件本身。大多数面向用户的插件首先在注册表中注册Compiler
。编译器的工作可以被压缩成以下亮点
- 通常有一个编译器的主实例。可以创建子编译器来委派特定的任务。
- 创建编译器的很多复杂性都是为它填充所有相关的选项。
-
webpack
具有WebpackOptionsDefaulter
并WebpackOptionsApply
专门设计用于提供所需Compiler
的所有初始数据。
- 这
Compiler
最终只是一个执行最少的功能来保持生命周期运行的功能。它将所有的加载/捆绑/写入工作委托给各种插件。
-
new LogPlugin(args).apply(compiler)
将插件注册到Compiler
生命周期中的任何特定的挂钩事件。
- 该
Compiler
暴露了run
它的kickstart对所有的编译工作方法webpack
。完成后,它应该调用传入callback
函数。记录统计和错误的所有尾端工作都在此回调函数中完成。
观看
Compiler
监视文件系统并重新编译为文件的支持“监视模式”更改。在监视模式下,编译器将发出附加事件“watch-run”,“watch-close”和“invalid”。这通常在开发过程中使用,通常在工具的引擎之下webpack-dev-server
,这样开发人员不需要每次手动重新编译。
有关监视模式的更多详细信息,请参阅Node.js API文档或CLI监视选项。
MultiCompiler
该模块MultiCompiler允许webpack在单独的编译器中运行多个配置。如果options
webpack的NodeJS api中的参数是一个选项数组,则webpack会应用单独的编译器并callback
在每个编译器执行结束时调用该方法。
var webpack = require('webpack');
var config1 = {
entry: './index1.js',
output: {filename: 'bundle1.js'}
}
var config2 = {
entry: './index2.js',
output: {filename:'bundle2.js'}
}
webpack([config1, config2], (err, stats) => {
process.stdout.write(stats.toString() + "\n");
})
事件挂钩
这是所有暴露的事件钩子的参考指南Compiler
。
活动名称 |
原因 |
PARAMS |
类型 |
---|---|---|---|
入门选项 |
- |
- |
bailResult |
后插件 |
设置完初始插件后 |
编译器 |
同步 |
之后,解析器 |
设置好解析器后 |
编译器 |
同步 |
环境 |
- |
- |
同步 |
经过环境 |
环境设置完成 |
- |
同步 |
前运行 |
compiler.run()启动 |
编译器 |
异步 |
跑 |
在阅读记录之前 |
编译器 |
异步 |
观看运行 |
在开始之前开始编译之前 |
编译器 |
异步 |
正常模块工厂 |
创建一个NormalModuleFactory后 |
normalModuleFactory |
同步 |
上下文模块厂 |
创建一个ContextModuleFactory后 |
contextModuleFactory |
同步 |
之前编译 |
编译参数已创建 |
compilationParams |
异步 |
编 |
在创建新编译之前 |
compilationParams |
同步 |
这个编译 |
发布编译事件之前 |
汇编 |
同步 |
汇编 |
编译创建完成 |
汇编 |
同步 |
使 |
- |
汇编 |
平行 |
之后编译 |
- |
汇编 |
异步 |
应该-发射 |
此时可以返回true / false |
汇编 |
bailResult |
需要追加通 |
- |
- |
bailResult |
发射 |
在释放资产以输出目录之前 |
汇编 |
异步 |
后发出 |
排放资产后输出目录 |
汇编 |
异步 |
DONE |
完成编译 |
统计 |
同步 |
失败 |
编译失败 |
错误 |
同步 |
无效 |
在无效的手表编译后 |
文件名,更改时间 |
同步 |
观看关闭 |
停止手表编译后 |
- |
同步 |
用法
这里是一个异步emit
事件处理程序的例子:
compiler.plugin("emit", function(compilation, callback) {
// Do something async...
setTimeout(function() {
console.log("Done with async work...");
callback();
}, 1000);
});
接口 | API相关
webpack 是一个模块打包器。webpack 处理带有依赖关系的模块,生成一系列表示这些模块的静态资源。
主页 | https://webpack.js.org/ |
源码 | https://github.com/webpack/webpack |
发布版本 | 3.8.1 |