前言
解决过 TypeScript 的项目大概都是从两个方向，Vue3 方向和 React Native 方向，而在 React Native 方向上我经常会遇到一个烦人的错误
Could not find a declaration file for module ‘juejin-type-study’. ‘d:/fe-project/nodejs/types-study/node_modules/juejin-type-study/main.js’ implicitly has an ‘any’ type.> Try
npm i --save-dev @types/types-studyif it exists or add a new declaration (.d.ts) file containingdeclare module 'juejin-type-study';
PS: juejin-type-study 代指 npm 包，也是文章的例子
这个问题的场景通常出现于 ts 项目中引用包时会出现
// main.ts
import { util } from "juejin-type-study";
util();
PS: ts 指代 TypeScript
问题起因
ts 作为一个有类型的语言，在 .ts 文件引用包时，默认时必须要有类型声明的，不能是 any，而 ts 对于包（module）的类型声明要求为提供 .d.ts，否则就要在 tsconfig.json 中声明
那么就有一个问题了，ts 是怎么找到包/模块的类型声明的？
TS 寻找类型规则
ts 对于包/模块的声明寻找规则如下
1.TypeScript 编译器先在当前编译上下文找模块的定义
2.如果找不到，则会去 node_modules 中的 @types（默认情况，目录可以修改，后面会提到）目录下去寻找对应包名的模块声明文件
说实话 TypeScript 的文档真的不怎样，虽然有中文文档，但文档整个的逻辑很乱，知识点东一块西一块，找起来很麻烦，像此类的寻址规则，通常文档会给出一个很严谨的描述，比如 Node.js 的模块寻址，但我在 ts 的文档里愣是半天没找着，等我找到了会更新一个更严谨的规则
作用
.ts 文件和 .js 文件不一样，对于 node.js 环境中 .js 有自己的模块寻址规则，而对于 ts 环境中 .ts 文件中的模块就是类型声明，ts 依靠类型声明来实现自己的功能，而 @types 其实就是类型声明的集中仓库，为 ts 项目中的引用提供类型说明
为什么需要 @types 这个目录？原因是过去很多模块/包是用的纯 JS 写的，没有类型声明，ts 就无法给到自动补全和智能提示等功能
下面就通过解决之前提出过的问题来解释实际中的 @types 是咋用的
创建 Module
在此之前我们需要一个模块来作为项目中引用的 Module，毕竟 @types 中包含的就是 Module 的类型声明
那没有 npm 包怎么办？需要去 npm 网站里创建一个吗？
实际上并不需要，了解过 Node.js 关于模块的寻址规则就可以直接在 node_modules 目录下伪造一个模块，具体原理可以参考这篇文章
在 node_modules 中创建一个 juejin-type-study 的目录，里面只需要包含两个文件，main.js 和 package.json
// main.js
export const util = () => {
console.log("Hello World");
};
创建 .d.ts
之前的 ts 给出一个警告中包含一个解决方案，其中如下
Try
npm i --save-dev @types/types-studyif it exists or add a new declaration (.d.ts) file containingdeclare module 'juejin-type-study';
里面提到可以创建一个 .d.ts 文件，包含 declare module 'juejin-type-study'; 就可以解决这个问题
实际操作就是在根目录下随便取个名字创建 .d.ts，通常为缺失类型声明的模块名称，如下
declare module 'juejin-type-study' {
export function util(): void;
}
_Module .d.ts 的模板可以查看文档
创建之后就不会再报错了，如下
而 @types 本质上也是一样，ts 会自动帮我们识别 .d.ts 的位置，默认是根目录和 /node_modules/@types/[libname]/index.d.ts
注意，VS Code 对于类型提示和警告似乎有缓存，如果将 .d.ts 迁移位置后仍然报错可以尝试删除模块引用重新输入
最后
整理了一套《前端大厂面试宝典》，包含了HTML、CSS、JavaScript、HTTP、TCP协议、浏览器、VUE、React、数据结构和算法，一共201道面试题，并对每个问题作出了回答和解析。
有需要的小伙伴，可以点击文末卡片领取这份文档，无偿分享
部分文档展示：
文章篇幅有限，后面的内容就不一一展示了
有需要的小伙伴，可以点下方卡片免费领取
