使用vue-cli 3.x构建TS+Vue项目模板

最近也是把手头上的私活忙完了,也大概差不多准备去北京寻求一份正式的工作.这几天就准备抽空写一下这些天的私活项目里的一些问题和一些移动端适配的处理 然后就准备回顾一些面试题,更新一下简历

随着前端项目的不断的复杂化,TypeScript带来的好处是显而易见的,也是未来的大势所趋,TypeScript带来的好处首先就是静态类型检查,静态类型检查可以避免很多不必要的错误, 不用在调试的时候才发现问题,其次就是IDE 智能提示在 TypeScript 这一类语言之前, JavaScript 的智能提示基本完全依赖 IDE 提供的推断. 而 TypeScript 不仅自己写的类库有丰富的类型信息, 也可以对其他纯 JS 项目进行类型标注 , 便于使用者直接在 IDE 中浏览 API, 好处也很明显. 对于阅读代码的人来讲, 各种类型一目了然,给我们的团队协作也带来了极大的便利
vue-cli在2.x版本的时候是需要自己配置ts的支持的,包括一些webpack的配置以及其他文件的各种改动,在vue-3.x发布后,直接支持了vue+ts的模板,方便了我们去构建TS+VUE的项目
下面就给大家介绍一下如何去构建一个TS+VUE的项目
Tips:如果你之前安装的是2.x的版本 请卸载掉重新安装3.x版本
安装好之后执行如下命令
vue create project(就是你的项目名称)
之后会出现如下页面

这时我们选择第二项进入到如下界面

使用空格键勾选你需要的东西 这里由于我们是构建ts项目所以一定要记得勾选TypeScript 其它选项就根据需求勾选即可(我个人还没使用过端到端测试,所以我就没有勾选E2E),然后回车之后进入更细节的配置界面 基本就是按照自己的需求选择 附上我的配置

然后耐心等待项目构建完毕即可 至此一个TS+VUE的项目构建完毕了,直接跑起来就可以了
大家可以自行感受一下TS带来的好处 之后也会陆续给大家奉上一些爬坑之路和一些TS项目的教程
希望能对大家有所帮助 有不足之处希望大家踊跃留言提出