Vue3+Typscript 环境搭建

元胞珊瑚
• 阅读 1944

前言

vue3 已经正式发布,很多vue3+typescript的文章比较久了,脚手架也更新了好多版本,安装难免会出现各种问题,以下为基础vue+typscript项目创建流程

一.更新@vue/cli

想使用最新的vue3,第一步一定是更新@vue/cli,我这边版本是@vue/cli@4.5.6,

yarn global add @vue/cli

二.创建项目

使用@vue/cli 命令行创建项目

vue create vue-ts

vue-ts 是我们的项目名称,执行上面的命令后,出现如下选项:

第一步 选择Manually select feature手动

Vue3+Typscript 环境搭建

第二步 选择空格选中需要的配置 bable,TypeScript必选

Vue3+Typscript 环境搭建

第三步 选中vue3.x版本

Vue3+Typscript 环境搭建

第四步 选择代码各种风格

Vue3+Typscript 环境搭建

第五步 选择eslint风格 (这里我们选的Standard标准)

Vue3+Typscript 环境搭建

第六步 启动项目

Vue3+Typscript 环境搭建

点赞
收藏
评论区
推荐文章
Souleigh ✨ Souleigh ✨
4年前
Vue3 - 响应性API
前言Vue3.x正式版发布已经快半年了,相信大家也多多少少也用Vue3.x开发过项目。那么,我们今天就整理下Vue3.x中的响应性API。响应性APIreactive作用:创建一个响应式数据。本质:传入数据(复杂类型:数组和json对象)包装成一个Proxy对象。如果传入其他对象,默认情况下修改对象,界面不会自动更新,如果想更新,可以通过重新赋值(创建
Souleigh ✨ Souleigh ✨
4年前
Vue3 的 15 个常用 API
来自公众号:前端印象本文会频繁地对比Vue2来介绍Vue3,也将对各个API结合代码实例讲解,这既是对自己知识的总结,也希望能帮助到大家一、前言大家都知道,现在Vue3的各个版本已经陆续发布了,并且有很多的团队已经着手各个库的开发与Vue2向Vue3的升级,我们当然也不能落后,所以赶紧将你手中的Vue2升级到Vue3,跟着本文一起学
菜鸟阿都 菜鸟阿都
3年前
vue项目无配置文件解决方案
问题在开发vue项目时,需要重新设置项目的启动端口,发现项目目录中并没有相关的配置文件【config目录】vue脚手架版本【通过vueversion查询】:@vue/cli4.5.13解决方案在vue项目根目录下创建vue.config.js配置文件vue.config.jsmodule.exportsdevServer:d
Easter79 Easter79
3年前
Vue CLI 2.x搭建vue,目录最全分析
一、vuecli介绍vuecli是一个用于快速搭建vue项目的脚手架。二、vuecli安装、更新安装过nodeJs、cnpm后,全局安装vuecli(以后其他项目可直接使用):cnpminstallgvuecli更新:cnpmupdate
LinMeng LinMeng
2年前
Vue3学习笔记---创建Vue3.0工程
创建方式分为两种:1.使用vuecli创建官方文档:https://cli.vuejs.org/zh/guide/creatingaproject.htmlvuecreate//查看@vue/cli版本,确保版本在4.5.0以上,在cmd中vueversion//安装或升级你的@vue/clinpminstallg@vue/cli//创
Jacquelyn38 Jacquelyn38
4年前
「快速学习系列」我熬夜整理了Vue3.x响应性API
前言Vue3.x正式版发布已经快半年了,相信大家也多多少少也用Vue3.x开发过项目。那么,我们今天就整理下Vue3.x中的响应性API。响应性APIreactive作用:创建一个响应式数据。本质:传入数据(复杂类型:数组和json对象)包装成一个Proxy对象。如果传入其他对象,默认情况下修改对象,界面不会自动更新,如果想更新,可以通过重新赋值(创建
Jacquelyn38 Jacquelyn38
4年前
「快速学习系列」我熬夜整理了Vue3.x响应性API
前言Vue3.x正式版发布已经快半年了,相信大家也多多少少也用Vue3.x开发过项目。那么,我们今天就整理下Vue3.x中的响应性API。响应性APIreactive作用:创建一个响应式数据。本质:传入数据(复杂类型:数组和json对象)包装成一个Proxy对象。如果传入其他对象,默认情况下修改对象,界面不会自动更新,如果想更新,可以通过重新赋值(创建
可莉 可莉
3年前
10分钟阅读一篇关于Vue
!file(https://oscimg.oschina.net/oscnet/up4f8ccb1755bb73c4ffe6a7ba91253ddc.jpg"file")VuecliVue脚手架的基本用法,vue脚手架用于快速生成vue项目基础架构:地址:https://cli.vuejs.org/zh/使用方式,安装3.x版本
手把手带你初探Vue 3.0 | 京东物流技术团队
距离Vue3.0正式发布已经过去一段时间了,2月7日Vue团队正式宣布Vue3正式成为新的默认版本。最近接触的新项目也使用Vue3.0来开发,因此有必要对它进行一波总结和学习。