我正在尝试只有一个文件来拥有将在整个应用程序中使用的大多数类型定义,我创建了一个名为@types
的文件夹和一个index.d.ts
文件导出我想要的每个接口/类型。
更新了我的tsconfig.json以包含该文件夹:
{
"compilerOptions": {
"outDir": "./built",
"allowJs": true,
"target": "es5",
"jsx": "react",
"allowSyntheticDefaultImports": true,
"lib": [
"es2015"
],
"typeRoots": [
"./@types"
],
},
"include": [
"./client/**/*",
"./@types/**/*"
],
"awesomeTypescriptLoaderOptions": {
"silent": true,
"errorsAsWarnings": true
}
}
尽管如此,即使在代码中(在client / ...内部),我引用存在于index.d.ts上的一个接口,vscode也会抛出“找不到名称”。
是否有更好的方法来解决此问题?
接口定义存在于@ types / index.d.ts中。
export interface Agent {
name: string;
...
}
用法:
interface Props extends RouteComponentProps<any> {
agent?: types.Agent;
}
答案 0 :(得分:1)
由于您使用的是export
关键字,因此@types/index.d.ts
被视为一个模块,从中访问类型的唯一方法是导入它们。例如,执行以下操作后,您可以参考types.Agent
:
import * as types from "../path/to/@types/index";
您可能希望删除所有出现的export
,以便将@types/index.d.ts
视为全局声明文件,并且可以将类型简称为Agent
。或者,您可以将类型放在名为types
的命名空间中,然后引用types.Agent
。
typeRoots
编译器选项无关。它告诉编译器在哪里可以找到带有应加载声明的包,但您的问题不是加载声明(因为@types/index.d.ts
与您的include
匹配)而是导入它们。