gpt4 book ai didi

无法识别 Angular 11 tsconfig 路径别名

转载 作者:行者123 更新时间:2023-12-05 08:19:52 26 4
gpt4 key购买 nike

我正在使用 Angular 11 并尝试使用短导入,例如 import {smthg} from '@common' 而不是 import {smthg} from '../../. ./普通'

但我在 IDEA 中总是报错:TS2307: Cannot find module '@common' or its corresponding type declarations.

在尝试编译 .ts 文件时控制台出现同样的错误(ng serve)

有趣的是,当我将 /index 添加到 import 时,IDEA 停止了诅咒,但错误并没有在控制台中消失

myAngularProject
│ package.json
│ tsconfig.json
│ tsconfig.app.json
│ angular.json

└───src
│ main.ts
│ index.html

└───app

└───common

└───features

tsconfig.json:

/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./src",
"paths": {
"@common/*": ["app/common/*"],
"@features/*": ["app/features/*"],
"@platform/*": ["app/platform/*"],
"@env": ["environments/environment"]
},
"outDir": "./dist/out-tsc",
"forceConsistentCasingInFileNames": true,
"strict": true,
"noImplicitReturns": true,
"noFallthroughCasesInSwitch": true,
"sourceMap": true,
"declaration": false,
"downlevelIteration": true,
"experimentalDecorators": true,
"moduleResolution": "node",
"importHelpers": true,
"target": "es2015",
"module": "es2020",
"lib": [
"es2018",
"dom"
]
},
"angularCompilerOptions": {
"strictInjectionParameters": true,
"strictInputAccessModifiers": true,
"strictTemplates": true
}
}

tsconfig.app.json:

{
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "./out-tsc/app",
"types": ["node"]
},
"files": [
"src/main.ts",
"src/polyfills.ts"
],
"include": [
"src/**/*.d.ts"
]
}

想法错误: idea error

控制台 tsc 错误: enter image description here

版本:

Angular CLI: 11.0.7
Node: 14.2.0
OS: darwin x64

Angular: 11.0.9
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router
Ivy Workspace: Yes

Package Version
---------------------------------------------------------
@angular-devkit/architect 0.1100.7
@angular-devkit/build-angular 0.1100.7
@angular-devkit/core 11.0.7
@angular-devkit/schematics 11.0.7
@angular/cli 11.0.7
@schematics/angular 11.0.7
@schematics/update 0.1100.7
rxjs 6.6.3
typescript 4.0.5

最佳答案

事实证明, Angular 引擎允许根据 tsconfig 中“路径”中指定的内容为路径创建别名。

但是为了能够访问模块的子文件夹以及从模块顶层的 index.ts 导出的内容,您需要像这样指定“路径”:

{
...
"compilerOptions": {
"baseUrl": "src",
"paths": {
"@common/*": ["app/common/*"],
"@common": ["app/common/index.ts"]
}
...
}
}

关于无法识别 Angular 11 tsconfig 路径别名,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/65846630/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com