Angular 7 找不到让 tsconfig.json 路径映射工作的方法 [英] Angular 7 Can't find a way to get tsconfig.json path mapping works

问题描述

我已经开始了一个 angular 7 项目，我正在尝试在 angular.json 上配置路径映射"以改变我的导入方式:

I've started an angular 7 project and I'm trying to configure the "path mapping" on angular.json to change my import way from this:

import { environment } from '../../../environments/environment';

为此:

import { environment } from '@environments/environment';

我已经在根级别的 tsconfig.json 文件上完成了这个配置:

I've done this config on the root level tsconfig.json file:

"compilerOptions": {
        "baseUrl": "src", // This must be specified if "paths" is.
         ...
        "paths": {
            "@app/*": ["app/*"],
            "@config/*": ["app/_config/*"],
            "@environments/*": ["environments/*"],
            "@shared/*": ["app/_shared/*"],
            "@helpers/*": ["helpers/*"]
        },
...

但是我在 cli 上也遇到了这个错误

But I also get this error on the cli

ERROR in src/app/errors/not-foud/not-found.component.ts(2,29): error TS2307: Cannot find module '@environments/environment'

有什么我遗漏的吗?

推荐答案

用 angular 9 RC 测试:

Tested with angular 9 RC:

更新两个地方:

在项目基础层让 vscode 开心:

at project base level to make vscode happy:

// tsconfig.json
// .
{
  ...
   "paths": {
      "@x/*": [
        "x/*"
      ],
      "@web-env/*": [
        "src/environments/*"
      ],
      "@web-app/*": [
        "./projects/web/src/app/*"
      ],
    }
  ...
}

在子项目中，更新此内容以使 cli 开心:

inside child project, update this to make cli happy:

// app.tsconfig.json
// .projectsweb	sconfig.app.json
{
  ...
  "baseUrl": "./",
  "paths": {
    "@web-env/*": [
      "src/environments/*"
    ],
    "@web-app/*": [
      "src/app/*"
    ],
  }
  ...
}

这篇关于Angular 7 找不到让 tsconfig.json 路径映射工作的方法的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！