javascript - 使用 Webpack library 和 libraryTarget 配置通过全局变量设置我们的自定义库

Question

我有一个库“xyz”，目前正在通过 npm 注册表将其作为 Node 模块导入。

现在，我想将它添加为库并通过全局名称“abc”公开它。

我想使用 webpack configuration实现这一目标。

所以，我知道这是我需要添加到我的 webpack 配置中的配置？:

 "output": {
        "path": SHELL_PATH + filePath.dist,
        "libraryTarget": "var",
        "library": "abc"
    }

但是，我如何将 abc 链接到我的 xyz 库，以便通过全局名称“abc”公开我的 abc 库中的方法？

我还需要做什么？

Answer 1

一个选项可能只是将 xyz 包装在 abc 库中，并将 abc 库作为全局变量公开。

webpack.config.js

module.exports = {
  entry: './index.js',
  output: {
    libraryTarget: 'var',
    library: 'abc',
    path: './dist',
    filename: 'abc.js'
  }
};

索引.js

module.exports = {
  xyz: require('xyz')
};

如果你想通过abc.xyz访问xyz字段，或者

module.exports = require('xyz');

如果想直接通过abc导出xyz字段