導入自定義 Angular 庫時，Angular 12 和 Webpack 5“找不到導出的節點名稱”

Question

我目前正在將一個大型 Angular 應用程序遷移到 Webpack 5 並開始收到此錯誤：

Compiling MyLib : main as umd
[webpack-cli] Error: Failed to find exported name of node (MonthViewComponent = /** @class */ (function (_super) {
        __extends(MonthViewComponent, _super);
        function MonthViewComponent(config) {
            var _this = _super.call(this) || this;
            _this.config = config;
            _this.openDayView = new i0.EventEmitter();
            return _this;
        }
  ...
  ..
  .

基本上，我在庫本身中使用但不在public-api.ts中導出的任何組件或指令都會出現錯誤。 如果我導出其中一個內部組件，Webpack 不會再抱怨這個，而是下一個內部組件，而且其中有很多。 這曾經工作得很好。

我已經在 Stackoverflow 和 Github 中閱讀過關於這個確切錯誤的類似問題，但它們都沒有提供適當的解決方案，或者這些解決方案在我的情況下不起作用。

MyLib 安裝在本地：

"dependencies": {
  "mylib": "file:/Users/brunofenzl/Projects/MyLib/dist/components",
  ...
}

我可以使用npm list mylib確認它已正確安裝

app@1.162.0-rc.0 /Users/brunofenzl/Projects/app
└── mylib@17.0.1-beta.0 -> ./../MyLib/dist/components

目前使用

• @角/* 12.2.13
• @ngtools/webpack：12.2.13
• 網絡包：5.72
• webpack-cli：4.92

知道是什么原因造成的嗎？ 任何幫助都非常感謝！

Answer 1

所以問題是tsc沒有為這個庫找到相應的類型。 我通過將庫名稱添加到我的 tsconfig.json 文件中的typeRoots屬性來修復它。 這樣，編譯器在庫目錄中找到了適當的類型。

"typeRoots": [
  "typings",
  "node_modules/@types/",
  "libraryname",
],