我不确定我是否正确地使用了rootDirs
。据我所知,它是用来在构建时制作virtual
目录的,比如一个Angular 组件库依赖于另一个Angular 组件库。
我的基本tsconfig如下所示(简化版):
{
"compilerOptions": {
"baseUrl": "./",
"rootDirs": [
"projects/component-library/example-1",
"projects/component-library/example-2"
],
"paths": {
"@org/component-library/*": [
"projects/component-library/*"
],
"@angular/*": [
"./node_modules/@angular/*"
]
},
}
}
我有两个部分:
第一个是这样导出的:
export * from './src/example-1';
然后组件2像这样使用它:
import { ExampleOneComponent } from '@org/component-library/example-1';
然后在构建ng build component-library
时为@org/component-library/example-2
生成此值。
example-1不在“rootDir”example-2下。“rootDir”应包含所有源文件。
我有以下文件结构:
dist
example-1/
example-2/
tsconfig.json
projects
component-library
example-1
src
example-1.component.ts
public-api.ts
ng-package.json
package.json
example-2
src
example-2.component.ts
public-api.ts
ng-package.json
package.json
1条答案
按热度按时间hwamh0ep1#
TypeScript编译器配置中的rootDirs选项用于指定根文件夹列表,这些根文件夹应用于解析非相对模块名称。当您希望编译器更容易地查找位于多个入口点或与源文件位于不同位置的模块时,可以使用此选项。
在您的示例中,有两个Angular 组件example-1和example-2,它们位于不同的入口点。要从example-2引用example-1,需要使用TypeScript编译器配置中的paths选项将example-1模块的路径Map到其位置。
在tsconfig.json文件中,可以添加以下内容:
在上面的配置中,您将rootDirs指定为example-2的位置,example-2是当前入口点的根文件夹。paths选项将@org/component-library/example-1模块Map到它在projects/component-library/example-1/src/example-1文件夹中的位置。
现在,在example-2组件中,可以按如下方式导入example-1组件:
通过这些更改,您应该能够从example-2组件构建和引用example-1组件。