TypeScript提供的类型注解在多人前端项目中，能显著提高开发效率、协作性和可维护性。
假定你已经使用 vue-cli 初始化了一个项目。
引入 TpyeScript 的相关依赖。
npm install typescript ts-loader --save-dev
添加项目的根目录下添加TypeScript配置文件 tsconfig.json。tsconfig.json 文件中指定了用来编译这个项目的根文件和编译选项。更多编译选项。
添加tsconfig.json
重命名 ./src/main.js 文件 为 ./src/main.ts，修改 webpack 入口文件为 ./src/main.ts，添加文件扩展.ts、.tsx。
修改webpack配置
在 webpack 的配置文件中添加 TypeScript 加载器 ts-loader，appendTsSuffixTo: [/\,vue$/] 选项用于提取 .vue单文件组件中的TS代码。
webpack配置
现在还需要在 src 目录下配置 Vue 的 vue-shims.d.ts 声明文件，ts-loader 才能知道Vue 是什么。
添加vue-shims.d.ts
npm i -S vue-property-decorator
Vue Property Decorator提供了7个装饰器(@Emit、@Inject、@Model、@Prop、@Provide、@Watch、@Component)，实现像原生 JavaScript class 那样声明组件。别忘了在 <script>标签中添加 lang=ts。
class声明组件
