警告：没有为 output.globals 中的外部模块 'X' 提供名称 – 猜测 'X'

Question

WARNING: No name was provided for external module 'moment' in output.globals – guessing 'momentImported'
WARNING: No name was provided for external module 'odata-parser' in output.globals – guessing 'parser'

当我尝试将我的库捆绑到通用模块定义时收到此消息。可以通过在 ng-package.json.

中添加 umdModuleIds 来修复警告

documentation给出了如下解释：

When writing the UMD bundle, ng-packagr does its best to provide common default values for the UMD module identifiers. Also, rollup will do its best to guess the module ID of an external dependency. Even then, you should make sure that the UMD module identifiers of the external dependencies are correct. In case ng-packagr doesn't provide a default and rollup is unable to guess the correct identifier, you should explicitly provide the module identifier by using umdModuleIds in the library's package file section like so: ...

umdModuleIds:

A map of external dependencies and their correspondent UMD module identifiers. Map keys are TypeScript / EcmaScript module identifiers. Map values are UMD module ids. The purpose of this map is to correctly bundle an UMD module file (with rollup). By default, rxjs, tslib and @angular/* dependency symbols are supported.

如何找到或检查 moment、odata-parser 或任何其他必须添加到 umdModuleIds 的模块的 UMD ID 的正确性？

Answer 1

我也发现文档很难理解。 ng-package.json 中的 ng-packagr umdModuleIds 设置是导入名称到 UMD 在 javascript global 对象中注册的模块 ID 的映射。

通过导入名称，我的意思是，在您的打字稿代码中：

import * as moment from 'moment';

字符串moment应该是umdModuleIds下的键。

该值应与包的 UMD 包中注册的全局变量相匹配。如果查看正在导入的 JS 文件，您会看到设置了 global.X 值。对于 moment.js，代码块是：

//! moment.js

;(function (global, factory) {
    typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
    typeof define === 'function' && define.amd ? define(factory) :
    global.moment = factory()
}(this, (function () { 'use strict';

global.moment = ... 行给了你所需要的。因此，要正确导入 moment，您的 ng-package.json 应包括：

  "lib": {
    "entryFile": "src/public-api.ts",
    "umdModuleIds": {
      "moment": "moment"
    }
  }

在这种情况下，事实证明 ng-packagr 的猜测是正确的 - 导入名称与 UMD 全局变量匹配，但您需要明确指定它以便 ng-packagr 确定。

应该有另一种（更好的）方法可以解决 NPM 依赖项的问题，即将库依赖项添加到库 package.json 文件（同一目录中的 package.json作为 ng-package.json 文件）。我会先尝试 - 我相信当依赖项包含在 package.json.

中时，ng-packagr 会正确找到 UMD 模块 ID

但是，如果您使用的是本地库（同一 angular 工作区中的库）或 ng-packagr 无法分析的库，则有必要查看UMD id 并确保它们匹配。例如，如果您为内部库使用 scoped/namespaced 名称，例如 @mycompany/util，您会看到 UMD 模块 ID 是这样注册的：

File: ~/dist/util/bundles/mycompany-util.umd.js

(function (global, factory) {
    typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :
    typeof define === 'function' && define.amd ? define('@mycompany/util', ['exports'], factory) :
    (global = global || self, factory((global.mycompany = global.mycompany || {}, global.mycompany.util = {})));
}(this, (function (exports) { 'use strict';

所以给定行 global.mycompany.util = 您需要指定 UMD 模块 ID，例如：

    "umdModuleIds": {
      "@mycompany/util": "mycompany.util"
      ...
    }

警告：没有为 output.globals 中的外部模块 'X' 提供名称 – 猜测 'X'

WARNING: No name was provided for external module 'X' in output.globals – guessing 'X'

umd

rollupjs

angular

ng-packagr