tsconfig 中的路径映射被解释为外部模块答案

【问题标题】：Path mapping in tsconfig is interpreted as an external moduletsconfig 中的路径映射被解释为外部模块
【发布时间】：2020-02-13 14:55:23
【问题描述】：

（上下文：角度 8，节点 12.15.0）

编辑：这似乎是一个错误，所以我打开了一个问题here

我正在建立一个图书馆。我在tsconfig.json 中定义了路径@env：

{
  "compilerOptions": {
    [...]
    "paths": {
      "@env/*": [
        "projects/mylib/src/environments/*"
      ]
    }
}

在代码中，我这样引用环境：

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

但似乎编译器被误导了，因为当我尝试构建 (ng build my-lib) 时，我收到以下警告：

WARNING: No name was provided for external module '@env/environment' in output.globals – guessing 'environment'

此外，在项目中导入模块会在编译时生成此错误消息：

ERROR in The target entry-point "my-lib" has missing dependencies:
 - @env/environment

@env/environment 似乎被解释为外部模块。我怎样才能避免这种情况？

重现步骤：

注意：我制作了一个现成的 SSCCE here

使用最简单的选项创建一个新项目 (ng new acme)：无路由，样式使用普通的旧 CSS。
在项目中，创建一个库（ng g generate library my-lib）
在projects/my-lib/src 下，创建一个文件夹environments，其中包含两个文件：environment.ts 和environments.prod.ts
像这样配置projects/my-lib/tsconfig.lib.json（我刚刚添加了paths块）：

{
  "extends": "../../tsconfig.json",
  "compilerOptions": {
    "outDir": "../../out-tsc/lib",
    "target": "es2015",
    "declaration": true,
    "inlineSources": true,
    "types": [],
    "lib": [
      "dom",
      "es2018"
    ],
    "paths": {
      "baseUrl": [ "./" ],
      "@env/*": [ "projects/my-lib/src/environments/*" ]
    }
  },
  "angularCompilerOptions": {
    "skipTemplateCodegen": true,
    "strictMetadataEmit": true,
    "enableResourceInlining": true
  },
  "exclude": [
    "src/test.ts",
    "**/*.spec.ts"
  ],
}

项目应该是这样的：

.
├── angular.json
├── browserslist
├── e2e
│   ├── protractor.conf.js
│   ├── src
│   │   ├── app.e2e-spec.ts
│   │   └── app.po.ts
│   └── tsconfig.json
├── karma.conf.js
├── package.json
├── package-lock.json
├── projects
│   └── my-lib
│       ├── karma.conf.js
│       ├── ng-package.json
│       ├── package.json
│       ├── README.md
│       ├── src
│       │   ├── environments
│       │   │   ├── environment.prod.ts
│       │   │   └── environment.ts
│       │   ├── lib
│       │   │   ├── my-lib.component.spec.ts
│       │   │   ├── my-lib.component.ts
│       │   │   ├── my-lib.module.ts
│       │   │   ├── my-lib.service.spec.ts
│       │   │   └── my-lib.service.ts
│       │   ├── public-api.ts
│       │   └── test.ts
│       ├── tsconfig.lib.json
│       ├── tsconfig.lib.prod.json
│       ├── tsconfig.spec.json
│       └── tslint.json
├── README.md
├── src
│   ├── app
│   │   ├── app.component.css
│   │   ├── app.component.html
│   │   ├── app.component.spec.ts
│   │   ├── app.component.ts
│   │   └── app.module.ts
│   ├── assets
│   ├── environments
│   │   ├── environment.prod.ts
│   │   └── environment.ts
│   ├── favicon.ico
│   ├── index.html
│   ├── main.ts
│   ├── polyfills.ts
│   ├── styles.css
│   └── test.ts
├── tsconfig.app.json
├── tsconfig.json
├── tsconfig.spec.json
└── tslint.json

现在，

要重现警告，请构建库：ng build my-lib
要重现错误，在主项目中导入MyLibModule 并构建它：ng build

【问题讨论】：

标签： angular typescript

【解决方案1】：

这是我从角度维护者here 得到的回复：

不建议对库使用路径映射。

还有：

从不支持库中的路径映射，也不应该一直有效，在您的情况下，它们似乎有效，因为 ts 配置从库泄漏到您的应用程序。

所以，结论是：不要在库中使用路径映射。

【讨论】：

有人知道相同功能的替代品吗？