Question

我创建了一个自定义的打字稿定义文件（brat.d.ts）

export declare class head {
   ready(callback: () => any);
}

export declare class Util {
   static embed(divId: string, collData: any, docData: any, webFontsURLs: Array<string>);
}

我正在像这样的Angular 7组件中导入上述定义文件

import {head, Util} from "../../brat/brat";

我上菜时，出现以下错误

'./ src / app / folder-mgmt / list-documents / list-documents.component.ts中的错误 未找到模块 ：错误：无法解析“ \ src \ app \ folder-mgmt \ list-documents”中的“ ../../brat/brat” `

有人可以建议我做错了什么吗

Answer 1

您在.d.ts文件中添加了声明，它们在您的项目中变得全局可用。但是您首先需要通过添加以下内容来调整tsconfig.json：

"files": [
  "additional.d.ts"
]

现在创建一个./addition.d.ts文件（相对于TypeScript项目根目录），然后在其中添加键入内容。不要使用export符号，只能声明类型。

declare class head {
   ready(callback: () => any);
}

declare class Util {
   static embed(divId: string, collData: any, docData: any, webFontsURLs: Array<string>);
}

您现在将在全球范围内使用它们。

如果您不希望它们在全球范围内可用，而是为缺少它们的模块添加类型，请在模块内声明它们。

declare 'module-name' {
  // ...
}

现在，当您执行import { ... } from 'module-name'时，TypeScript可以识别这些内容。

Answer 2

为了解决这个问题，我做了以下

我从自定义打字稿定义文件（brat.d.ts）文件中删除了导出，并将其更改为

declare class head {
   static ready(callback: () => any);
}
declare class Util {
   static embed(divId: string, collData: any, docData: any, webFontsURLs: Array<string>);
}

使用Angular CLI创建的Angular项目在项目的根文件夹中具有tsconfig.json文件。

我在tsconfig.json中存在的“ compilerOptions”的“ typeRoots”属性内添加了包含自定义定义文件的文件夹的路径。

在Angular组件中，我删除了用于导入自定义打字稿定义文件（在我的情况下为“ brat.d.ts”）的导入语句

Answer 3

遇到相同的问题，进行了一些研究和一些 SO 链接，在您的情况下，请确保正确导入即从“ ../../brat/brat”导入{head，Util}； -> 从“ ../../brat/brat.d”导入{head，Util}；
就像在导入模块时一样，您不添加文件扩展名，而模块是brat.d.ts。

在我的情况下，当文件（模块）例如item.ts包含我导出的类Item时发生冲突

export class Item {
  public reference: string;
  public name: string;
   constructor( name: string, reference: string) {
     this.reference = reference;
     this.name = name;
   }
   get getReference(): string {
     return this.reference;
   }
   get getName(): string {
     return this.name;
   }
   set setName(newName: string) {
      this.name = newName;
   }
 }

在导入时使用组件中的类import { Item } from './models/item';，并且在组件中保存（Ctrl + s）时使用ERROR in src/app/app.component.ts(2,20): error TS2306: File 'D:/PROJET/Personal Resoruces/Angular2/DuckFowl/src/app/Models/item.ts' is not a module.。我将文件（模块）名称更改为 item.models.ts ，保持类不变，一切正常。保持模块名称与导出的类，函数，接口等的名称有所帮助，但是您可以随意使用任何名称。

对包含导出元素和组件元素的文件进行 Ctrl + s ，以刷新Angular CLI。

解决了我的问题。

Screen shot of project component and model

我的配置

Angular CLI: 8.3.6
Node: 10.16.0
OS: win32 x64
Angular: 8.2.8
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.803.6
@angular-devkit/build-angular     0.803.6
@angular-devkit/build-optimizer   0.803.6
@angular-devkit/build-webpack     0.803.6
@angular-devkit/core              8.3.6
@angular-devkit/schematics        8.3.6
@angular/cli                      8.3.6
@ngtools/webpack                  8.3.6
@schematics/angular               8.3.6
@schematics/update                0.803.6
rxjs                              6.4.0
typescript                        3.5.3
webpack                           4.39.2

Love＆Lead;-）

Angular 7无法包含自定义打字稿定义文件

3 个答案: