使用vue-cli创建vue3+ts项目
提示:该文章为vue3+ts的!该文章是博主看的B站尚硅谷视频课来进行整理的!尚硅谷的课真的很不错!
前言
vue3出了之后,大家已经发现vue3的底层是拿ts写的,当然,vue对ts的适配度可是很好的了,在项目中使用ts做开发的话,可以从开始就能规避很多类型上的一些bug,真的很香啊!这篇文章的话,给大家介绍一下怎样用vue-cli搭建vue+ts的项目!
提示:以下是本篇文章正文内容,下面案例可供参考
一、使用 vue-cli 创建项目
官方文档:https://cli.vuejs.org/zh/guide/creating-a-project.html#vue-create
## 安装或升级脚手架
npm install -g @vue/cli
## 确保 vue-cli 版本在 4.5.0 以上
vue -V
## 创建项目
vue create ts-demo
二、使用步骤
以下为博主自己的搭建方法,大家可以按照自己的习惯来创建
- Please pick a preset => 选择 Manually select features
- Check the features needed for your project => 选择上 TypeScript ,特别注意点空格是选择,点回车是下一步
- Choose a version of Vue.js that you want to start the project with => 选择 3.x (Preview)
- Use class-style component syntax => 直接回车
- Use Babel alongside TypeScript => 直接回车
- Pick a linter / formatter config => 直接回车
- Use history mode for router? => 直接回车
- Pick a linter / formatter config => 直接回车
- Pick additional lint features => 直接回车
- Where do you prefer placing config for Babel, ESLint, etc.? => 直接回车
- Save this as a preset for future projects? => 直接回车
运行项目
// 进去创建的目录 cd ts-demo // 运行项目 npm run serve
总结
提示:这里对文章进行总结:
以上就是vue3+ts项目搭建,如果您觉得文章有用的话,辛苦大家点个赞或者加个关注啦~,文章不定期更新
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。