Typescript 关于*。d、 ts"；打字

我对

*.d.ts

感到好奇，因为我是打字新手。有人告诉我，这种文件在C++中类似于“头文件”，但只适用于JS。但是我无法将纯JS文件转换为

*.d.ts

文件，除非我强制将

*.JS

更改为

*.ts

。所以我有三个文件： JS文件、TS文件和

*.d.TS

文件

---

他们之间有什么关系

如何使用

*.d.ts

文件？这是否意味着我可以永久删除

*.ts

文件

如果是这样，那么

*.d.ts

文件如何知道哪个JS文件正在映射到自身

---

如果有人能给我举个例子，那就太好了。

这个“d.ts”文件用来提供关于用JavaScript编写的API的类型脚本信息。其思想是使用jQuery或下划线之类的东西，这是一个现有的javascript库。您想从您的typescript代码中使用这些代码

您可以编写仅包含类型注释的d.ts文件，而不是在typescript中重写jquery或下划线或其他内容。然后，从typescript代码中，您可以获得静态类型检查的typescript好处，同时仍然使用纯JS库

这要归功于TypeScript的限制，即不允许您在

import

语句末尾添加“.ts”扩展名。因此，当您引用某个文件时，比如说，

my module.js

，如果旁边有一个

my module.d.ts

，则TypeScript将包括其内容：

src/
my-module.js
my-d.ts模块
索引

my-module.js

const thing=42；
module.exports={thing}；

my-d.ts模块

索引

从“/my module”/”导入{thing} 
d
代表：

编译TypeScript脚本时，有一个选项可生成
一个声明文件（扩展名为.d.ts），用作
已编译JavaScript中组件的接口。在这个过程中
编译器去掉所有函数和方法体并保留
仅导出类型的签名。结果
然后可以使用声明文件来描述导出的虚拟机
当第三方
开发人员从TypeScript使用它

声明文件的概念类似于头文件的概念
在C/C++中找到文件

可以手动为现有JavaScript编写类型声明文件
库，正如对jQuery和Node.js所做的那样

流行JavaScript的大量声明文件集合
库位于和中的GitHub上。提供了一个名为的命令行实用程序来提供帮助
从存储库中搜索并安装声明文件

我无法发表评论，因此将此作为一个答案。
我们在尝试将现有类型映射到javascript库时遇到了一些麻烦

要将
.d.ts
文件映射到其javascript文件，您需要为
.d.ts
文件指定与javascript文件相同的名称，将它们保存在同一文件夹中，并将需要它的代码指向
.d.ts
文件

例如：
test.js
和
test.d.ts
位于
testdir/
文件夹中，然后将其像这样导入react组件中：

import*作为来自“/testdir/Test”的测试；

.d.ts
文件作为命名空间导出，如下所示：

导出为命名空间测试；
导出接口TestInterface1{}
导出类TestClass1{}
比如@takeshin said.d代表typescript（.ts）的声明文件

在回答这篇文章之前，需要澄清的几点-

Typescript是javascript的语法超集
Typescript不能单独运行，它需要转换成javascript（）
“类型定义”和“类型检查”是typescript通过javascript提供的主要附加功能。（）
如果您认为typescript只是一个语法超集，那么它有什么好处-

要回答此帖子-

正如我们所讨论的，typescript是javascript的超集，需要转换成javascript。所以，如果库或第三方代码是用typescript编写的，它最终会转换为javascript，javascript项目可以使用它，但反之亦然

例如—

如果您安装javascript库-

npm install --save mylib

并尝试在typescript代码中导入它-

import * from "mylib";

你会得到一个错误

“找不到模块‘mylib’。”

正如@Chris所提到的，许多库（如下划线、Jquery）已经用javascript编写。与其为typescript项目重新编写这些库，还需要一种替代解决方案

为了做到这一点，您可以在javascript库中提供名为*.d.ts的类型声明文件，就像上面的mylib.d.ts一样。声明文件仅提供在各自javascript文件中定义的函数和变量的类型声明

现在，当你尝试-

import * from "mylib";

mylib.d.ts被导入，它充当javascript库代码和typescript项目之间的接口。
工作示例针对特定情况：

假设你有我的模块，你正在通过npm共享

您可以使用
npm安装我的模块安装它

你这样使用它：

import * as lol from 'my-module';

const a = lol('abc', 'def');

模块的逻辑全部位于
index.js
：

module.exports = function(firstString, secondString) {

  // your code

  return result
}

要添加打字，请创建一个文件
index.d.ts
：

declare module 'my-module' {
  export default function anyName(arg1: string, arg2: string): MyResponse;
}

interface MyResponse {
  something: number;
  anything: number;
}

这个答案假设您有一些不想转换为TypeScript的JavaScript，但您希望通过对
.js
进行最小的更改来受益于类型检查。
一个<>代码> dts文件非常类似于C或C++头文件。其目的是定义一个接口。以下是一个例子：

妈
import * as lol from 'my-module';

const a = lol('abc', 'def');

module.exports = function(firstString, secondString) {

  // your code

  return result
}

declare module 'my-module' {
  export default function anyName(arg1: string, arg2: string): MyResponse;
}

interface MyResponse {
  something: number;
  anything: number;
}

/** Makes a string harder to read. */
declare function mashString(
    /** The string to obscure */
    str: string
):string;
export = mashString;

// @ts-check
/** @type {import("./mashString")} */
module.exports = (str) => [...str].reverse().join("");

// @ts-check
const mashString = require("./mashString");
console.log(mashString("12345"));