tsconfig.json中声明的角库路径别名无效:模块未找到:错误:无法解决
tsconfig.json中声明的角库路径别名无效:模块未找到:错误:无法解决
提问于 2022-04-19 11:35:48
我正在开发一个角(v12)库和一个小应用程序来测试它的结构如下：
├── projects
│ ├── my-app
│ │ ├── karma.conf.js
│ │ ├── src
│ │ ├── tsconfig.app.json
│ │ └── tsconfig.spec.json
│ └── my-lib
│ ├── README.md
│ ├── karma.conf.js
│ ├── ng-package.json
│ ├── node_modules
│ ├── package-lock.json
│ ├── package.json
│ ├── src
│ ├── tsconfig.lib.json
│ ├── tsconfig.lib.prod.json
│ └── tsconfig.spec.json
└── tsconfig.json在根./tsconfig.json中，我声明路径别名(据我理解，VS代码可以识别)：
{
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./",
"outDir": "./dist/out-tsc",
"forceConsistentCasingInFileNames": true,
"strict": true,
"noImplicitOverride": true,
"noPropertyAccessFromIndexSignature": true,
"noImplicitReturns": true,
"noFallthroughCasesInSwitch": true,
"sourceMap": true,
"paths": {
"my-lib": [
"dist/my-lib/my-lib",
"dist/my-lib"
],
"@services/*": [
"projects/my-lib/src/lib/services/*"
]
},
"declaration": false,
"downlevelIteration": true,
"experimentalDecorators": true,
"moduleResolution": "node",
"importHelpers": true,
"target": "es2017",
"module": "es2020",
"lib": [
"es2020",
"dom"
]
},
"angularCompilerOptions": {
"enableI18nLegacyMessageIdFormat": false,
"strictInjectionParameters": true,
"strictInputAccessModifiers": true,
"strictTemplates": true
}
}在./project/my-lib/tsconfig.lib.json中，我再次声明路径别名(据我所知，ng-packagr编译器将解释路径别名)：
{
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./",
"outDir": "./dist/out-tsc",
"paths": {
"@services/*": [ "src/lib/services/*" ],
},
"sourceMap": true,
"declaration": false,
"module": "es2015",
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "es5",
"typeRoots": [
"node_modules/@types"
],
"lib": [
"es2017",
"dom"
]
}
}./angular.json引用tsconfig.lib.json：
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"my-lib": {
"projectType": "library",
"root": "projects/my-lib",
"sourceRoot": "projects/my-lib/src",
"prefix": "lib",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:ng-packagr",
"options": {
"project": "projects/my-lib/ng-package.json"
},
"configurations": {
"production": {
"tsConfig": "projects/my-lib/tsconfig.lib.prod.json"
},
"development": {
"tsConfig": "projects/my-lib/tsconfig.lib.json"
}
},
"defaultConfiguration": "production"图书馆正在编译，没有任何错误。
例如，当我在我的-app中导入库并想导入一个服务时，它不会解析路径别名：
./node_modules/my-lib/fesm2015/my-lib.mjs:11:0-56 - Error: Module not found: Error: Can't resolve '@services/my-lib/my-lib.service' in '/Users/***/projects/ANGULAR/angular-tour-of-heroes/node_modules/my-lib/fesm2015'
Error: node_modules/my-lib/lib/custom-page/custom-page.component.d.ts:2:30 - error TS2307: Cannot find module '@services/my-lib/my-lib.service' or its corresponding type declarations.
2 import { MyLibService } from '@services/my-lib/my-lib.service';
Error: node_modules/my-lib/lib/custom-page/custom-page.component.d.ts:2:30 - error TS2307: Cannot find module '@services/my-lib/my-lib.service' or its corresponding type declarations.
2 import { MyLibService } from '@services/my-lib/my-lib.service';我尝试了世界上的任何组合配置，路径似乎不可能在角库中使用
回答 1
Stack Overflow用户
发布于 2022-08-19 15:20:07
用于生产的tsconfig文件是projects/my-lib/tsconfig.lib.prod.json (正如在angular.json中声明的那样)，因此您可能忘记了设置生产的别名路径。据我理解，这应该指向dist文件夹中的正确路径。
尽管如此，我也有同样的问题(但已经在本地运行dev时)，所以这只是猜测。
编辑：
我让它在本地运行，现在在尝试构建时也面临着类似的问题。在我的例子中，它是一个错误not an absolute path (没有参考错误的来源)，当我在组件中的任何地方使用别名时，都会出现很多No suitable injection token for parameter 'tooltip' of class 'MyComponent'.错误。
我仍然希望你能使它发挥作用，但也许我的答案不会导致解决办法。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/71924302
复制相关文章
相似问题
腾讯云开发者
