首页 > 其他分享 >vue版本区别

vue版本区别

时间:2023-12-13 16:35:18浏览次数:29  
标签:vue cli 区别 版本号 global yarn 版本

一、说明:

1、Vue CLI 4.5以下,对应的是Vue2;Vue CLI 4.5及以上,对应的是Vue3,当然,创建项目的时候可以选择Vue2
2、Vue2最老的版本是含index.html的,通过“yarn global add vue-cli”安装,得到的最新版本号是2.9.6
3、只有Vue2不含Vue3的版本范围是3.3.0~4.4.6,通过“yarn global add @vue/cli”安装,生成的项目不含index.html
4、Vue3版本最低版本号是4.5.0,通过“yarn global add @vue/cli”安装,可以选择创建vue2.x还是vue3.x

二、不同版本的vue对应的vue-router版本和vuex版本

  • vue版本是2.9.6时,对应的vue-router版本是3.0.1、vuex版本号是未知
  • vue版本是3.11.0时,对应的vue-router版本号是3.5.1、vuex版本号是3.6.2
  • vue版本是4.4.6时,对应的vue-router版本号是3.2.0、vuex的版本号是3.4.0
  • vue版本是4.5.0时,创建的vue2项目对应的vue-router版本号是4.0.0-0、vuex的版本号是4.0.0-0;创建的vue3项目对应的vue-router版本号是3.2.0、vuex的版本号是3.4.0。
  • vue版本5.0.8

三、搭建项目步骤

1、最老的Vue2创建项目(生成含有index.html的vue项目)

vue的安装命令如下

yarn global add vue-cli

创建项目命令如下

vue init webpack my-project

得到的项目目录如下图


 

参考:https://segmentfault.com/a/1190000011275993

2、只有Vue2不含Vue3的版本(范围是3.3.0~4.4.6,可指定版本号进行安装)

vue的安装命令如下

yarn global add @vue/[email protected]

创建项目命令如下

vue create my-project

得到的项目目录如下图


 

3、Vue3创建项目(也可创建Vue2版的项目)

vue的安装命令如下

yarn global add @vue/cli

cnpm install -g @vue/cli@5

创建项目命令如下

vue create my-project

得到的vue2项目目录如下图


 

 

得到的vue3项目目录如下图


 

参考:https://www.cnblogs.com/coober/p/10875647.html

卸载vue

yarn global remove vue-cli
yarn global remove @vue/cli

了解了vue的版本就可以根据自己需要来搭建项目了



作者:八妹sss
链接:https://www.jianshu.com/p/23034ad47a8c
来源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

标签:vue,cli,区别,版本号,global,yarn,版本
From: https://www.cnblogs.com/wjsqqj/p/17899348.html

相关文章

  • std::make_pair & std::make_tuple 的区别和联系
    std::make_pair和std::make_tuple都是用于创建对应类型的对象的C++标准库函数模板。它们的区别主要在于它们所处理的数据类型和返回类型。std::make_pair:std::make_pair用于创建一个std::pair对象,std::pair是一个包含两个值的容器。#include<iostream>#include<......
  • Unity升级到2022版本后,打开Spine会卡住
    1)Unity升级到2022版本后,打开Spine会卡住2)iPhone在同时播放多个音效的时候会压低某些音源的音量3)在Y77手机上出现IMGSRV:GetMainShaderConstantBufferBaseAddress:Unsupported4)UE4打包后在部分安卓机型出现“花屏”这是第364篇UWA技术知识分享的推送,精选了UWA社区的热门话题,涵盖......
  • 华为认证 | 有本HCIE证书,待遇区别竟然这么大
    在当今竞争激烈的IT行业,高含金量的职业证书不仅是对个人技能水平的认证,更是提升职业发展、薪资待遇的利器。其中,HCIE证书无疑是备受瞩目的明星认证。那么持有HCIE证书待遇有啥区别?下面我们就来了解一下吧。01持有HCIE证书待遇有啥区别★薪资福利持有HCIE证书往往意味着更高的薪资......
  • Vue后台项目开发必备:全面解析分辨率适配与网页缩放技巧!
    1.各屏幕分辨率下适配展示首先给大家展示一下我的屏幕分辨率兼容效果,方便大家来判断我的适配方案是否可行正常1920*1080100%1920*1080150%1440*900100%1440*900150%2.屏幕分辨率适配方案这里就不再过多举例了,通过这四张图可以看出来页面布局并没有受到过多的影响,所以直接上代......
  • Vue后台项目开发必备:全面解析分辨率适配与网页缩放技巧!
    1.各屏幕分辨率下适配展示首先给大家展示一下我的屏幕分辨率兼容效果,方便大家来判断我的适配方案是否可行正常1920*1080100%1920*1080150%1440*900100%1440*900150%2.屏幕分辨率适配方案这里就不再过多举例了,通过这四张图可以看出来页面布局并没有受到过多的影响,所以直接上代......
  • springboot+VUE——mybatis分页和Element Plus的分页组件实践
    分页只有基础的分页功能,跳转和动态选择每页展示多少条数据的功能可以参考ElementPlus的分页组件自行配置并且传入相应的方法即可!<scriptlang="ts"setup>/***分页变量数据*/constpagination=ref({ current_page:1, // 当前页码,此处默认为第一页 total_data:0......
  • 阻塞队列linkedBlockQuene和syncroBlockQuene的区别?
    在Java中,LinkedBlockingQueue和SynchronousQueue是两种不同类型的阻塞队列,它们有一些关键的区别:实现机制:LinkedBlockingQueue使用一个链表实现的有界或无界队列。有界队列的容量是固定的,而无界队列的容量理论上是无限的。SynchronousQueue是一个特殊的阻塞队列,它在内部......
  • vue+elementUi中国省市区/省市,三级/两级联动选择
    安装城市数据npminstallelement-china-area-data-S导入数据import{regionData,codeToText}from'element-china-area-data' 1.显示全部城市HTML代码:<template#equipmentdistrict-form=""><el-cascaderplaceholder="请选择......
  • springboot+vue小白升级之路14-实现系统公告首页公告展示、springboot+vue小白升级之
    还是接着之前的内容,我把新增的功能代码贴出来,给大家参考学习。数据库droptableifexistsan_user;createtablean_user( idintnotnullauto_incrementprimarykeycomment'主键id', namevarchar(255)notnulluniquecomment'姓名', `password`varchar(255)notnu......
  • springboot+vue小白升级之路13-AOP实现登录、增删改查操作日志管理
    还是接着上一个的内容,我把这个新增的关于日志的功能代码都贴出来,供大家学习参考。数据库数据库droptableifexistsan_log;createtablean_log( idintnotnullauto_incrementprimarykeycomment'主键id', namevarchar(255)notnullcomment'操作内容', log_dateda......