【TypeScript】在实战中的一些总结

1.node的npm包

node编程中最重要的思想之一就是模块。当然这也是其他编程语言的思想。

ES6标准发布后，module成为标准，标准的使用是以export指令导出接口，以import引入模块。

但因为一些历史原因，虽然Node.js已经实现了99%的ES6新特性，采用的却是CommonJS规范，使用require引入模块，使用module.exports导出接口。所以，我们不能在vue.config.js中使用import导入模块。

想要使用import，必须引入babel转义支持，通过babel进行编译，使其变成node的模块化代码。这个请自行查阅方法，本人并不想去试验，因为此方法不一定能完全解决问题。

2.typescript

作为ES6的超集，Vue3.0已经完全支持ts，另外的两大框架 reactangular可以说早就支持ts了。至此，前端框架三巨头全部对ts进行了友好支持。【One by one系列】一步步学习TypeScript

3.ts声明文件

以前称为类型定义文件，.d.ts。在使用 TypeScript 开发的项目中，常常需要引入公共模块，或者第三方库。如果这些公共模块或第三方库是用 JS 写的，那么 TS 就无法检测到类型信息，在编译阶段会报错。

能不能将这些公共模块或第三方库的代码用 TS 重写呢？答案是不行，因为重写之后，使用这些库的 JS 项目就不兼容了，这些项目不能执行 TS 代码。

有没有一种方式，既可以让这些类库支持 TS ，又能兼容 JS 项目呢？有的，就是使用 TS 声明文件。

4.ts引入js模块

当 TS 项目中引入了js模块，TS 默认会去同级目录下找同名的声明文件(eg:index.js→index.d.ts)，找不到就要报错，也就意味着我们可能ts无法使用

5.编译d.ts

如上所述，d.ts是为了抹平ts与js之间的差距，让ts能够引入js包，但是，如果我们用ts编写的代码，试图打包成npm包，提供给 ts或者js使用，该怎么办？只需要编译即可。

在tsc命令后跟上-d参数即可在编译成js文件时，顺带输出d.ts文件。这样一个包既可以提供给js使用者，也可以提供给ts使用者。我们一般也会在一些npm包的新版本中看到.js 与 d.ts。

当然，博主依然有一个疑问：是否可以只提供ts，并不考虑js开发者，即只上传纯ts源代码的npm包？

*6.编译的错

TypeScript 错误 “Module '...' has no default export

这是因为引入的模块没有声明任何default导出对象。所以在import的时候，需要使用大括号，在里面指定导入的对象。或者全量导入import * as xxx from 'moudelpath'，前者为默认导入，后者为命名导入，作为开发者，请一定要去看清楚源代码的声明，否则就会疑惑自己模仿一些es包的导入方式，好像ts也没报错，但是一编译就会报错，可能你以为不是你以为的，请夯实基础，正确理解ts的一些机制。特别是有一些用于d.ts文件的包，他的es引入方式和ts可能是完全不同，切记，切记。