如何使用插件修改webpack 5主模板
如何使用插件修改webpack 5主模板
提问于 2021-05-03 15:50:27
在webpack 4中，我有一个插件来修改webpack运行时，如下所示
function MyPlugin() {}
MyPlugin.prototype.apply = function (compiler) {
compiler.hooks.compilation.tap(
'MyPlugin',
function (compilation) {
compilation.mainTemplate.hooks.requireExtensions.tap(
'MyPlugin',
(source) =>
source.replace(
'__webpack_require.n = ....',
myNewCode
)
);
}
);
};这在webpack 5中停止了工作，现在source参数总是空的。这方面的文档还比较缺乏。仍然有可能像这样挂接到构建中吗？我只是需要一个新的插件钩子还是什么？
回答 1
Stack Overflow用户
回答已采纳
发布于 2021-05-06 17:20:35
我能让它工作起来
MyPlugin.prototype.apply = function (compiler) {
compiler.hooks.compilation.tap(
'MyPlugin',
function (compilation) {
compilation.hooks.processAssets.tapPromise(
{
name: 'MyPlugin',
stage:
compiler.webpack.Compilation.PROCESS_ASSETS_STAGE_ADDITIONAL,
},
async (assets) => {
const oldSource = assets['runtime.js'];
const { ReplaceSource } = compiler.webpack.sources;
const newSource = new ReplaceSource(oldSource, 'MyPlugin');
const start = oldSource.source().indexOf(codeToReplace);
const end = start + codeToReplace.length;
newSource.replace(start, end, newCode, 'MyPlugin');
await compilation.updateAsset('runtime.js', newSource);
}
);
}
);
};页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/67365277
复制相关文章
相似问题
腾讯云开发者
