Vue项目如何接入Typescript

(内容同步自小邹的头条号：沪漂程序员的生活史)

一、为什么要接入typescript

avascript由于自身的弱类型，使用起来非常灵活。

这也就为大型项目、多人协作开发埋下了很多隐患。如果是自己的私有业务倒无所谓，主要是对外接口和公共方法，对接起来非常头疼。主要表现在几方面：

1. 参数类型没有校验，怎么传都有，有时会出现一些由于类型转换带来的未知问题。
2. 接口文档不规范，每次都要通过读代码才能知道传什么，怎么传
3. 接口编写符合规范，但是公共库中有大量的处理类型校验的代码

这就非常不利于工程标准化。于是我们决定引入typescript进行代码层面的强校验。

原有vue项目接入ts主要包含下面几大步骤：

1. 安装typescript相关npm包
2. 修改webpack和ts配置文件
3. 项目公共库和vue文件改造

1. 安装typescript相关npm包

这块有个非常重要的点需要注意：

就是要根据你本地的环境，去升级对应版本的typescript

这块是很多初次使用的同学都会遇到的问题。

因为只是看到了官网的教程，一步一步安装完发现各种报错。主要问题就是webpack版本不匹配，或者其他一些npm包版本不匹配

以我本地为例：

我本地环境是webpack3，所以直接安装最新版本的typescript，控制台会报错webpa