定义

TypeScript是JavaScript类型的超集，它的扩展名是.ts。

• TypeScript是一门强类型语言，它的变量在使用前，都必须声明类型。
• TypeScript可以将大量变量的类型声明统一提取到单独的文件，此类文件被称为声明文件，它的文件扩展名是.d.ts，它可以被TypeScript解释器读取，并且能直观地表示出各种变量的使用方式。
• 由于TypeScript是JavaScript的超集，所以声明文件也能用来表示JavaScript脚本的使用方式。
• 一般来讲，组织声明文件的方式取决于库是如何被使用的。

传送门：https://www.tslang.cn/docs/handbook/declaration-files/introduction.html

如何引用

1. 在你需要声明的.js或.ts文件的同一位置，插入你的同名.d.ts文件。

   |-- src
     |-- index.js
     |-- index.d.ts
     |-- app.ts
     |-- app.d.ts
   

2. package.json文件有一个types(或typings)属性专门用来定义main入口文件的声明文件路径。
3. npm仓库里有一个@types组织，专门用来存放库的声明文件，引用时只需要安装npm install --save-dev @types/库名即可。

   • 所有人都可以申请将自己的所有声明文件按规范提交到@types中去。
   • 例如：jest测试库的声明文件就储存在@types/jest中。
   • @types下面还有很多底层类的声明文件，比如Number、String等在@types/code-js里都有声明。
   • 传送门：https://github.com/DefinitelyTyped/DefinitelyTyped

4. 在声明文件中使用/// <reference types="..." />头，来引入依赖的其它声明。

   types指某个其它声明的库，而不是声明文件的路径。

问题

问：为什么我在编辑器中选择Promise类进行溯源，会给我打开了一个lib.es2015.promise.d.ts文件？其中有对Promise的声明。而我的项目中明明没有这个文件。
答：因为你的项目或者编辑器，通过某种引用方式（上面的3或4方式），引用了这个声明文件。

总结

多看看官方文档，写代码总是很简单。

检测node环境

node --version
npm --version
npx --version

创建bin文件夹
.js, .min.js, .d.ts 输出目录
创建src文件夹
ts项目源码目录

在项目目录下创建 package.json 文件
npm init
配置发布者的信息 和 包声明

npm安装gulp
npm install --global gulp-cli

创建gulpfile.js脚本文件

'use strict';
const gulp = require("gulp");
const minify = require('gulp-minify');
const inject = require("gulp-inject-string");
const ts = require('gulp-typescript');
const merge = require('merge2');
const tsProject = ts.createProject('tsconfig.json');

gulp.task('buildJs', () => {
    return tsProject.src()
        .pipe(tsProject())
        .js.pipe(inject.replace('var es;', ''))
        .pipe(inject.prepend('window.es = {};\n'))
        .pipe(inject.replace('var __extends =', 'window.__extends ='))
        .pipe(minify({ ext: { min: ".min.js" } }))
        .pipe(gulp.dest('./bin'));
});

gulp.task("buildDts", ["buildJs"], () => {
    return tsProject.src()
        .pipe(tsProject())
        // .dts.pipe(inject.append('import e = framework;'))
        .pipe(gulp.dest('./bin'));
});

gulp.task("copy", ["buildDts"], () => {
    return gulp.src('bin/**/*')
        .pipe(gulp.dest('../demo/egret_demo/libs/framework/'))
        .pipe(gulp.dest('../extensions/behaviourTree-ai/egret-demo/libs/framework/'))
});

gulp.task('build', ['copy'], () => {
    return merge([
        gulp.src('bin/*.js')
            .pipe(gulp.dest('../demo/laya_demo/bin/libs/')),
        gulp.src('bin/*.ts')
            .pipe(gulp.dest('../demo/laya_demo/libs/')),
        gulp.src('bin/framework.d.ts')
            .pipe(gulp.dest('../extensions/behaviourTree-ai/source/lib/'))
            .pipe(gulp.dest('../extensions/ecs-star/lib/'))
            .pipe(gulp.dest('../extensions/ecs-tween/lib/'))
    ])
});

build
gulp build

Description
gulp官网

参考 如何修改 node_modules 里的文件（同事看了直呼内行）

问题

在使用dumi开发开源框架的时候遇到无法找到模块 xxx 的声明文件，

一直以来都是使用@types/xxx跟创建一个.d.ts来解决的

但这次加了不生效，仍然还是无法找到模块 xxx 的声明文件，然后我就在src目录下创建一个types.d.ts，之后编译器不再报错了，我以为就这样解决了，但是在打包的时候。

他又报错了，打包不了。

解决

最后没办法了，直接去node_modules里面源文件添加一个.d.ts文件，这时打包跟编译器报错都解决了，但是防止下一位同事打包能正常打包，就去找了一下保存node_modules的解决方案。
具体是通过 patch-package这个npm包来实现的。

使用patch-package实现

1、先安装patch-package：npm i patch-package --save-dev

出问题了，换yarn add patch-package --save-dev

2、修改package.json，新增命令postinstall:

“scripts”: {
“postinstall”: “patch-package”
}

3、修改node_modules对应代码。

4、执行命令：npx patch-package 你对应的包名 比如我的 npx patch-package rc-util。

又出问题了，去找一下GitHub，yarn - TypeError: Cannot read property ‘dependencies’ of undefined 有点相似，最后使用yarn patch-package rc-util --use-yarn

终于成功了，目录下也成功出现了这个文件。

最后去试了一下删除node_modules，重新安装一下

新增的.d.ts文件回来了。具体用法查看patch-package。