前言如果原项目的webpack版本低于4，建议直接使用vue-cli新建项目，然后将项目文件迁移到原项目中添加TypeScript添加TypeScript和代码检查npminstalltypescriptts-loadertslinttslint-loader-DInitializeTypeScriptandCodeinspectionconfiguration详细配置TypeScriptTslint注意：推荐使用Eslint进行代码检查，因为我操作的项目eslint版本比较低，不支持ts代码检查。/node_modules/.bin/tsc--init./node_modules/.bin/eslint--init修改webpack配置添加.ts.tsx扩展用于搜索ts文件resolve:{extensions:['.ts','.tsx','.js','.vue','.json']}为ts文件添加loader配置{//为文件添加ts识别test:/.ts$/,enforce:'pre',loader:'tslint-loader'},{test:/.tsx?$/,loader:'ts-loader',options:{appendTsSuffixTo:[/.vue$/],}},添加vue支持ortfortsnpminstallvue-property-decoratorvue-class-component-S改造vue文件只需要在脚本标签中加上lang="ts"，引入vue-property-decorator。具体使用可以参考npm中vue-property-decorator的介绍和TypeScript文档。将TypeScript添加到新项目。如果项目是vue-cli创建的，可以直接使用vueadd@vue/添加typescript。具体可以参考vuetypescript插件安装vue-cli。已有的vue脚手架可以忽略，直接下一步安装：npminstall-g@vue/cli#ORyarnglobaladd@vue/cli创建项目vuecreatemy-project选择自定义配置选择TypeScript选择代码风格格式化检测工具等待完成同样具体用法参考npm中vue-property-decorator的介绍和TypeScript文档
