javascript - Angular 8 条路径

Question

我有一个 Angular 8 项目，我尝试在我的

src/app/helpers/auth.guard.ts
 import { AuthenticationService } from '@app/services';

我的 AuthenticationService ts 文件有一个路径

src/app/services/authentication.service.ts

当我运行 ngserve 时出现错误

ERROR in src/app/helpers/auth.guard.ts(4,39): error TS2307: Cannot find module '@app/services'.

这是我的 tsconfig.js

 {
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "downlevelIteration": true,
    "experimentalDecorators": true,
    "module": "esnext",
    "moduleResolution": "node",
    "importHelpers": true,
    "target": "es2015",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2018",
      "dom"
    ],
    "paths": {
        "@app/*": ["src/app/*"],
        "@environments/*": ["src/environments/*"]
    }
  },
  "angularCompilerOptions": {
    "fullTemplateTypeCheck": true,
    "strictInjectionParameters": true
  }
}

这是我的 tsconfig.app.json

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

我尝试使用 --aot 运行项目，但这不起作用

Answer 1

以下是可能出现的问题:

您的身份验证服务位于以下路径:

src/app/services/authentication.service.ts

但是当您尝试使用以下方式导入它时:import { AuthenticationService } from '@app/services'，它会尝试从 services 目录导入服务。您的 service 目录不会导出身份验证服务，因此您会收到此错误。

修复方法如下:

1. 在 services 目录中创建一个名为 index.ts 的文件，使其位于路径:src/app/services/index.ts。
2. 在此 index.ts 文件中，添加以下导出语句:

export * from './authentication.service.ts';

这将从 services 文件夹中导出您的服务，以便您的导入语句能够在 src/app/services/ 中找到身份验证服务。

由于您的 tsconfig 中已经有一个路径别名 "@app/*": ["src/app/*"]，因此您的导入语句应该可以正确解析。

如果不起作用，请告诉我。