在 TypeScript v2.2.2 中,如何为没有 tsd 的 Javascript 库创建定义文件?
In TypeScript v2.2.2, how do you create a definition file for a Javascript library that doesn't have a tsd?
我正在搜索一个完整的示例,或者至少是为一个在 @ 中没有的 JavaScript 库创建定义文件(不一定必须是 tsd)的最佳实践类型或包含在包装中。
到目前为止,我已经能够将基本解决方案放在一起 here,但它似乎没有遵循 TypeScript 网站上 "Definitions" 部分中给出的确切指导。
在上面的存储库中,我正在使用包 @google-cloud/datastore
,据我所知,它还没有 tsd 文件。文档足够好,我应该能够为我感兴趣的部分创建一个手动定义文件,但我很难弄清楚手动导出此类定义的最佳做法是什么。
具体来说,来自 here,它说:
/*~ This is the module template file for class modules.
*~ You should rename it to index.d.ts and place it in a folder with the same name as the module.
*~ For example, if you were writing a file for "super-greeter", this
*~ file should be 'super-greeter/index.d.ts'
*/
/*~ Note that ES6 modules cannot directly export class objects.
*~ This file should be imported using the CommonJS-style:
*~ import x = require('someLibrary');
*~
*~ Refer to the documentation to understand common
*~ workarounds for this limitation of ES6 modules.
*/
/*~ If this module is a UMD module that exposes a global variable 'myClassLib' when
*~ loaded outside a module loader environment, declare that global here.
*~ Otherwise, delete this declaration.
*/
根据上面的说明,听起来我应该能够将 index.d.ts
文件放到我的 node_modules/@types
目录之外的文件夹中,该文件夹模仿与我的模块相同的文件夹结构。例如,在我的存储库中,我有一个顶级目录 @google-cloud/datastore
,其中包含一个 index.ts 文件,但从文档来看,我应该可以使用一个 index.d.ts 文件;但是,我的模块和编译器都无法找到它。我需要编译器选项吗?
其次,我在存储库中采用的方法是否正确。他们的网站上没有记录这种方式,在得出解决方案之前我不得不猜测它。我实质上是将 JavaScript 包 google-cloud/datastore
导入 index.ts,添加我的类型,然后将其导出以供我的模块使用。但是,我的模块必须通过 ./@google-cloud/datastore
引用包,因为这是 TypeScript 定义的实际位置。
简而言之,在 TypeScript v2.2.2 中,为 JavaScript 不包含 tsd 的库创建小型本地 TypeScript 定义文件的最佳做法是什么?
后果
我用 Alex 建议的解决方案更新了我的存储库,一切似乎都按预期工作。我想指出,它似乎也可以通过添加 { "baseUrl": "types" }
参数来工作,但我不清楚为什么这是正确的,所以我采用了建议的方法。 --traceResolution
标志对此非常有帮助。
在这个示例中,我确保还包括另一个带有 TypeScript 定义的模块,lodash
,以确保正常的模块解析仍然正确。
我的directory/file结构:
+ js
...
+ node_modules
+ @google-cloud
+ datastore
+ lodash
+ @types
+ lodash
+ ...
+ types
+ @google-cloud
- index.d.ts
+ datastore
- index.d.ts
- index.ts
- package.json
- tsconfig.json
跟踪分辨率
出于好奇,我想 post 调用 tsc --traceResolution
结果的 incorrect/correct 示例。为了清楚起见,我对结果进行了缩写。
不正确 没有 paths
参数 TypeScript 将 @google-cloud/datastore
解析为 index.js
文件,这是错误的。
======== Module name '@google-cloud/datastore' was successfully resolved to 'C:/Users/Kory/Documents/Repos/playground/manual-typescript-definition/node_modules/@google-cloud/datastore/src/index.js'. ========
用 paths
参数更正 。请注意 @google-cloud/datastore
解析为 index.d.ts
文件而不是 JavaScript 文件。
======== Module name '@google-cloud/datastore' was successfully resolved to 'C:/Users/Kory/Documents/Repos/playground/manual-typescript-definition/types/@google-cloud/datastore/index.d.ts'. ========
您可以使用 compilerOptions paths
和 typeRoots
获取 tsc
来检测自定义 .d.ts
文件。它将在列出的目录中搜索与您的包匹配的文件夹(即 @google-cloud/datastore
)
例如
"paths": {
"*": [
"types/*"
]
},
"typeRoots": [
"./types"
]
其中 types
是目录结构根目录下的一个文件夹,您创建了一个文件 types/@google-cloud/datastore/index.d.ts
您可以使用 tsc --traceResolution
快速查看 files/folders tsc
在搜索类型定义时正在考虑的内容
我正在搜索一个完整的示例,或者至少是为一个在 @ 中没有的 JavaScript 库创建定义文件(不一定必须是 tsd)的最佳实践类型或包含在包装中。
到目前为止,我已经能够将基本解决方案放在一起 here,但它似乎没有遵循 TypeScript 网站上 "Definitions" 部分中给出的确切指导。
在上面的存储库中,我正在使用包 @google-cloud/datastore
,据我所知,它还没有 tsd 文件。文档足够好,我应该能够为我感兴趣的部分创建一个手动定义文件,但我很难弄清楚手动导出此类定义的最佳做法是什么。
具体来说,来自 here,它说:
/*~ This is the module template file for class modules.
*~ You should rename it to index.d.ts and place it in a folder with the same name as the module.
*~ For example, if you were writing a file for "super-greeter", this
*~ file should be 'super-greeter/index.d.ts'
*/
/*~ Note that ES6 modules cannot directly export class objects.
*~ This file should be imported using the CommonJS-style:
*~ import x = require('someLibrary');
*~
*~ Refer to the documentation to understand common
*~ workarounds for this limitation of ES6 modules.
*/
/*~ If this module is a UMD module that exposes a global variable 'myClassLib' when
*~ loaded outside a module loader environment, declare that global here.
*~ Otherwise, delete this declaration.
*/
根据上面的说明,听起来我应该能够将 index.d.ts
文件放到我的 node_modules/@types
目录之外的文件夹中,该文件夹模仿与我的模块相同的文件夹结构。例如,在我的存储库中,我有一个顶级目录 @google-cloud/datastore
,其中包含一个 index.ts 文件,但从文档来看,我应该可以使用一个 index.d.ts 文件;但是,我的模块和编译器都无法找到它。我需要编译器选项吗?
其次,我在存储库中采用的方法是否正确。他们的网站上没有记录这种方式,在得出解决方案之前我不得不猜测它。我实质上是将 JavaScript 包 google-cloud/datastore
导入 index.ts,添加我的类型,然后将其导出以供我的模块使用。但是,我的模块必须通过 ./@google-cloud/datastore
引用包,因为这是 TypeScript 定义的实际位置。
简而言之,在 TypeScript v2.2.2 中,为 JavaScript 不包含 tsd 的库创建小型本地 TypeScript 定义文件的最佳做法是什么?
后果
我用 Alex 建议的解决方案更新了我的存储库,一切似乎都按预期工作。我想指出,它似乎也可以通过添加 { "baseUrl": "types" }
参数来工作,但我不清楚为什么这是正确的,所以我采用了建议的方法。 --traceResolution
标志对此非常有帮助。
在这个示例中,我确保还包括另一个带有 TypeScript 定义的模块,lodash
,以确保正常的模块解析仍然正确。
我的directory/file结构:
+ js
...
+ node_modules
+ @google-cloud
+ datastore
+ lodash
+ @types
+ lodash
+ ...
+ types
+ @google-cloud
- index.d.ts
+ datastore
- index.d.ts
- index.ts
- package.json
- tsconfig.json
跟踪分辨率
出于好奇,我想 post 调用 tsc --traceResolution
结果的 incorrect/correct 示例。为了清楚起见,我对结果进行了缩写。
不正确 没有 paths
参数 TypeScript 将 @google-cloud/datastore
解析为 index.js
文件,这是错误的。
======== Module name '@google-cloud/datastore' was successfully resolved to 'C:/Users/Kory/Documents/Repos/playground/manual-typescript-definition/node_modules/@google-cloud/datastore/src/index.js'. ========
用 paths
参数更正 。请注意 @google-cloud/datastore
解析为 index.d.ts
文件而不是 JavaScript 文件。
======== Module name '@google-cloud/datastore' was successfully resolved to 'C:/Users/Kory/Documents/Repos/playground/manual-typescript-definition/types/@google-cloud/datastore/index.d.ts'. ========
您可以使用 compilerOptions paths
和 typeRoots
获取 tsc
来检测自定义 .d.ts
文件。它将在列出的目录中搜索与您的包匹配的文件夹(即 @google-cloud/datastore
)
例如
"paths": {
"*": [
"types/*"
]
},
"typeRoots": [
"./types"
]
其中 types
是目录结构根目录下的一个文件夹,您创建了一个文件 types/@google-cloud/datastore/index.d.ts
您可以使用 tsc --traceResolution
快速查看 files/folders tsc
在搜索类型定义时正在考虑的内容