如何在webpack5中创建外部插件？

Question

我试着创建了一个外挂，可以请教webpack不要捆绑的东西。因为线程插件不接受webpack的外部设置，所以它只能使用插件来做外部的事情。

我尽了最大努力做到这一点：

const ModuleFilenameHelpers = require('webpack/lib/ModuleFilenameHelpers');
const ExternalModule = require('webpack/lib/ExternalModule');

class ExternalsPlugin {
  constructor(options) {
    this.options = options;
  }

  apply(compiler) {
    const options = this.options;
    compiler.hooks.normalModuleFactory.tap('ExternalsPlugin', function (nmf) {
      nmf.hooks.resolve.tapAsync(
        {
          name: 'NormalModuleFactory',
          stage: 100,
        },
        function (module, callback) {
          if (ModuleFilenameHelpers.matchObject(options, module.createData.resource)) {
            const { context, dependencies } = module;
            const newModule = new ExternalModule(module.request, options.type || compiler.options.output.libraryTarget);
            callback(null, newModule);
          }
          callback(null);
        },
      );
    });
  }
}

但是它上升了

callback is not a function
TypeError: callback is not a function
    at /Users/linonetwo/Desktop/repo/TiddlyGit-Desktop/node_modules/webpack/lib/util/AsyncQueue.js:352:5
    at Hook.eval [as callAsync] (eval at create (/Users/linonetwo/Desktop/repo/TiddlyGit-Desktop/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:6:1)
    at AsyncQueue._handleResult (/Users/linonetwo/Desktop/repo/TiddlyGit-Desktop/node_modules/webpack/lib/util/AsyncQueue.js:322:21)
    at /Users/linonetwo/Desktop/repo/TiddlyGit-Desktop/node_modules/webpack/lib/util/AsyncQueue.js:305:11
    at /Users/linonetwo/Desktop/repo/TiddlyGit-Desktop/node_modules/webpack/lib/Compilation.js:1780:5
    at /Users/linonetwo/Desktop/repo/TiddlyGit-Desktop/node_modules/webpack/lib/NormalModuleFactory.js:761:5
    at eval (eval at create (/Users/linonetwo/Desktop/repo/TiddlyGit-Desktop/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:13:1)
    at /Users/linonetwo/Desktop/repo/TiddlyGit-Desktop/node_modules/webpack/lib/NormalModuleFactory.js:322:16
    at Hook.eval [as callAsync] (eval at create (/Users/linonetwo/Desktop/repo/TiddlyGit-Desktop/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:6:1)
    at /Users/linonetwo/Desktop/repo/TiddlyGit-Desktop/node_modules/webpack/lib/NormalModuleFactory.js:304:31
    at Hook.eval [as callAsync] (eval at create (/Users/linonetwo/Desktop/repo/TiddlyGit-Desktop/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:6:1)
    at /Users/linonetwo/Desktop/repo/TiddlyGit-Desktop/node_modules/webpack/lib/NormalModuleFactory.js:288:30
    at eval (eval at create (/Users/linonetwo/Desktop/repo/TiddlyGit-Desktop/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:16:1)
    at /Users/linonetwo/Desktop/repo/TiddlyGit-Desktop/webpack.plugins.js:39:11
    at _next0 (eval at create (/Users/linonetwo/Desktop/repo/TiddlyGit-Desktop/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:8:1)
    at eval (eval at create (/Users/linonetwo/Desktop/repo/TiddlyGit-Desktop/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:30:1)

那么，是否有人知道如何使用插件正确地将某些模块声明为外部模块？

Answer 1

这就是答案：

const ModuleFilenameHelpers = require('webpack/lib/ModuleFilenameHelpers');
const ExternalModule = require('webpack/lib/ExternalModule');

class ExternalsPlugin {
  constructor(options) {
    this.options = options;
  }

  apply(compiler) {
    const options = this.options;
    compiler.hooks.normalModuleFactory.tap('ExternalsPlugin', function (nmf) {
      nmf.hooks.resolve.tapAsync(
        {
          name: 'NormalModuleFactory',
          stage: 100,
        },
        function (module, callback) {
          if (ModuleFilenameHelpers.matchObject(options, module.createData.resource)) {
            const { context, dependencies } = module;
            const newModule = new ExternalModule(module.request, options.type || compiler.options.output.libraryTarget, module.createData.userRequest);
            callback(null, newModule);
          } else {
            callback(null);
          }
        },
      );
    });
  }
}

我忘了在second callback(null)周围添加其他内容

 else {
            callback(null);
          }

所以回调两次，第二次抛出错误。