如何覆盖 Angular-CLI 项目中的 node_module 错误类型?

Posted

技术标签:

【中文标题】如何覆盖 Angular-CLI 项目中的 node_module 错误类型?【英文标题】:How can I overwrite a node_module bad typing in Angular-CLI project? 【发布时间】:2018-10-08 11:05:49 【问题描述】:

我有一个坏的 node_module (angularfire2),它没有使用在另一个 node_module (@firebase) 中找到的新类型进行更新。

我正在尝试让 tsconfig.json 帮助我为其设置路径别名,以便将其重新路由以解析为 src 中编写的调整文件,而不是 @firebase 的 node_modules 中不兼容的类型文件作为临时修复.

我知道我可以降级 (@firebase) node_module 以使其兼容。然而,这个问题不是让它发挥作用。我只是想弄清楚如何能够覆盖 node_module 错误的类型。

我正在使用 Angular 的 cli 项目,希望不需要弹出 webpack 来控制它。

我从 post 了解到,我会覆盖 @types 文件夹中的类型。

但是,我仍然无法在 node_module 本身中使用 index.d.ts 覆盖类型。

例如(来自angularfire2)

import  FirebaseApp as FBApp  from '@firebase/app-types';

我想在我的 tsconfig.json 中为 @firebase/app-types 创建一个别名,以便 angularfire2 将在 src/types-overwrite/@firebase/app-types 中查找。

我有以下 tsconfig.json,但它仍然无法正确执行别名,并且仍会解析为不兼容的 node_module 的键入文件,而不是 src 中的那个。

我的 tsconfig.json


  "compileOnSave": false,
  "compilerOptions": 
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "moduleResolution": "node",
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "target": "es5",
    "typeRoots": [
      "node_modules/@types",
      "src/types-overwrite"
    ],
    "paths": 
      "@firebase/app-types": ["src/types-overwrite/@firebase/app-types"]
    ,
    "lib": [
      "es2017",
      "dom"
    ]
  ,
  "include": [
    "node_modules/angularfire2",
  ]

如何在 Angular-CLI 项目的 node_module 中覆盖 index.d.ts 键入文件,或者如何让我的 tsconfig.json 工作?

更新:

我添加了一个存储库来展示问题:

'@firebase/app-types' 具有用于日志记录的额外类型(from_node_modules 或 from_src)(因此 node_modules 已包含在存储库中)

网址:https://github.com/Jonathan002/resolve-typing

【问题讨论】:

【参考方案1】:

我在这篇文章中找到了答案:

Exclude/overwrite npm-provided typings

添加:

baseUrl - 解析工作所需的路径 路径 包括(更新)

复制到我的 tsconfig.json,同时复制包类型代码并在声明文件夹中引用它:

声明/包名.d.ts

tsconfig.ts


  "compilerOptions": 
    "lib": ["es6"],
    "module": "commonjs",
    "noImplicitReturns": true,
    "outDir": "lib",
    "sourceMap": true,
    "target": "es6",
    "baseUrl": ".",
    "paths": 
      "*": [
        "src/*", 
        "declarations/*",
      ]
    ,
  ,
  "compileOnSave": true,
  "include": ["src/**/*.ts", "src/**/*.tsx", "declarations/**/*.d.ts"],

【讨论】:

以上是关于如何覆盖 Angular-CLI 项目中的 node_module 错误类型?的主要内容,如果未能解决你的问题,请参考以下文章

PhpStorm WebStorm angular-cli 项目;如何关闭棉绒

如何使用 angular-cli (6.x) 创建单一仓库项目结构

如何使用特定于应用程序的值覆盖共享库中的 sass 变量

带有快速项目的 angular-cli

如何使用 angular-cli 只执行一个测试规范

angular-cli server - 如何将 API 请求代理到另一台服务器?