乐趣区

关于angular:如何解决-Angular-custom-library-module-在-ng-build-时无法被识别的错误

SAP Spartacus angular.json, 是 Angular CLI 主动生成的文件,外面针对 storefrontapp,生成的 tsConfig 属性,指向一个 tsconfig.app.json 文件, 该文件指定 ng build 如何对该 app 进行构建。

这里应用的构建工具 builder 是 @angular-builders/custom-webpack:browser.

types 属性为何为空?

很多 JavaScript 库,比方 jQuery、Jasmine 测试库和 Angular,会通过新的个性和语法来扩大 JavaScript 环境。而 TypeScript 编译器并不能原生的辨认它们。当编译器不能辨认时,它就会抛出一个谬误。

能够应用 TypeScript 类型定义文件 —— .d.ts 文件 —— 来通知编译器你要加载的库的类型定义。

比方上图第 13 行代码的 build.process.env.d.ts:

很多库在本人的 npm 包中都蕴含了它们的类型定义文件,TypeScript 编译器和编辑器都能找到它们。Angular 库也是这样的。任何 Angular 应用程序的 node_modules/@angular/core/ 目录下,都蕴含几个 d.ts 文件,它们形容了 Angular 的各个局部。

TypeScript 带有一个非凡的申明文件,名为 lib.d.ts。该文件蕴含了 JavaScript 运行库和 DOM 的各种罕用 JavaScript 环境申明。

在生产模式下的构建,应用另一个配置文件:tsconfig.app.prod.json:

在这个文件里,从新对 compilerOptions 的 paths 进行了定义。

因而,如果应用了其余的 custom library,须要将其在 dist 下的门路,同样申明在 paths 节点下:

否则的话,命令行 ng serve –configuration production 就会报如下谬误,找不到名为 test-lib 的 custom library:

增加之后,yarn build 工作失常:

构建胜利:

对于 tsconfig.json 文件里的 include 和 exclude 属性用法:

include 用于指定要蕴含在程序中的文件名或模式数组。这些文件名是绝对于蕴含 tsconfig.json 文件的目录解析的。

例子:

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

这个设置会将下列文件蕴含进来:

蕴含和排除反对通配符来实现 glob 模式:

    • 匹配零个或多个字符(不包含目录分隔符)
  • ? 匹配任何一个字符(不包含目录分隔符)
  • **/ 匹配嵌套到任何级别的任何目录

更多 Jerry 的原创文章,尽在:” 汪子熙 ”:

退出移动版