SAP Spartacus angular.json, 是 Angular CLI 自動(dòng)生成的文件，里面針對(duì) storefrontapp，生成的 tsConfig 屬性，指向一個(gè) tsconfig.app.json 文件,該文件指定 ng build 如何對(duì)該 app 進(jìn)行構(gòu)建。

這里使用的構(gòu)建工具 builder 是 @angular-builders/custom-webpack:browser.

types 屬性為何為空？

很多 JavaScript 庫(kù)，比如 jQuery、Jasmine 測(cè)試庫(kù)和 Angular，會(huì)通過新的特性和語(yǔ)法來(lái)擴(kuò)展 JavaScript 環(huán)境。 而 TypeScript 編譯器并不能原生的識(shí)別它們。 當(dāng)編譯器不能識(shí)別時(shí)，它就會(huì)拋出一個(gè)錯(cuò)誤。

可以使用TypeScript 類型定義文件 —— .d.ts 文件 —— 來(lái)告訴編譯器你要加載的庫(kù)的類型定義。

比如上圖第13行代碼的 build.process.env.d.ts:

很多庫(kù)在自己的 npm 包中都包含了它們的類型定義文件，TypeScript 編譯器和編輯器都能找到它們。Angular 庫(kù)也是這樣的。 任何 Angular 應(yīng)用程序的 node_modules/@angular/core/ 目錄下，都包含幾個(gè) d.ts 文件，它們描述了 Angular 的各個(gè)部分。

TypeScript 帶有一個(gè)特殊的聲明文件，名為 lib.d.ts。該文件包含了 JavaScript 運(yùn)行庫(kù)和 DOM 的各種常用 JavaScript 環(huán)境聲明。

在生產(chǎn)模式下的構(gòu)建，使用另一個(gè)配置文件：tsconfig.app.prod.json:

在這個(gè)文件里，重新對(duì) compilerOptions 的 paths 進(jìn)行了定義。

因此，如果使用了其他的 custom library，需要將其在 dist 下的路徑，同樣聲明在 paths 節(jié)點(diǎn)下：

否則的話，命令行 ng serve --configuration production 就會(huì)報(bào)如下錯(cuò)誤，找不到名為 test-lib 的 custom library：

添加之后，yarn build 工作正常：

構(gòu)建成功：

關(guān)于 tsconfig.json 文件里的 include 和 exclude 屬性用法：

include 用于指定要包含在程序中的文件名或模式數(shù)組。 這些文件名是相對(duì)于包含 tsconfig.json 文件的目錄解析的。

例子：

{"include": ["src/**/*", "tests/**/*"] }

這個(gè)設(shè)置會(huì)將下列文件包含進(jìn)來(lái)：

包含和排除支持通配符來(lái)實(shí)現(xiàn) glob 模式：

• • 匹配零個(gè)或多個(gè)字符（不包括目錄分隔符）
• ? 匹配任何一個(gè)字符（不包括目錄分隔符）
• **/ 匹配嵌套到任何級(jí)別的任何目錄

更多Jerry的原創(chuàng)文章，盡在：“汪子熙”:

總結(jié)

以上是生活随笔為你收集整理的如何解决 Angular custom library module 在 ng build 时无法被识别的错误的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。