全局安装 Vue cli3 和 继续使用 Vue-cli2.x操作
官方链接：https://cli.vuejs.org/zh/guide/installation.html
1.安装Vue cli3
关于旧版本
Vue CLI 的包名称由 vue-cli 改成了 @vue/cli。 如果你已经全局安装了旧版本的 vue-cli(1.x 或 2.x)，你需要先通过 npm uninstall vue-cli -g 或 yarn global remove vue-cli 卸载它。
Node 版本要求
Vue CLI 需要 Node.js 8.9 或更高版本 (推荐 8.11.0+)。你可以使用 nvm 或 nvm-windows在同一台电脑中管理多个 Node 版本。
可以使用下列任一命令安装这个新的包：
npm install -g @vue/cli
# OR
yarn global add @vue/cli
安装之后，你就可以在命令行中访问 vue 命令。你可以通过简单运行 vue，看看是否展示出了一份所有可用命令的帮助信息，来验证它是否安装成功。
你还可以用这个命令来检查其版本是否正确 (3.x)：
vue --version
2.安装完Vue cli3 之后，还想用vue-cli2.x 版本
Vue CLI 3 和旧版使用了相同的 vue 命令，所以 Vue CLI 2 (vue-cli) 被覆盖了。如果你仍然需要使用旧版本的 vue init 功能，你可以全局安装一个桥接工具：
npm install -g @vue/cli-init
//安装完后 就还可以使用 vue init 命令
vue init webpack my_project
补充知识：Vue 之vue-router router.beforeEach导航守卫，陷入死循环
官方文档 :https://router.vuejs.org/zh/guide/advanced/navigation-guards.html
判断浏览器缓存是否有用户的信息，没有的话跳转登录页。
看了官方文档，直接这样写了。（试了手动清除缓存，再从url里面跳登录页，直接陷入了死循环）
router.beforeEach((to,from,next)=>{
if(sessionStorage.getItem('loginData')){
Toast('跳转成功');
next();
}else {
//没有登录，去跳转登录页
next({
path:'/login'
});
}
});
原因是由于 next('/login')是自己指定路径的，路由跳转的时候还执行一遍beforeEach导航钩子，所以上面出现死循环；
再加个判断就OK了
router.beforeEach((to,from,next)=>{
// console.log(to);
// console.log(from);
if(sessionStorage.getItem('loginData')){
Toast('跳转成功');
next();
}else {
//没有登录，去跳转登录页
if(to.path === '/login'){
next();
}else {
next({
path:'/login'
});
}
}
});
以上这篇全局安装 Vue cli3 和 继续使用 Vue-cli2.x操作就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
本文将结合实例代码介绍Javascript结合Vue实现对任意迷宫图片的自动寻路，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-06-06
这篇文章主要为大家介绍了vue实现前端按钮组件权限管理，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-09-09
ref是Vue3中一个非常重要的功能,它可以用来获取DOM节点,从而实现对DOM节点的操作,下面这篇文章主要给大家介绍了关于vue3中获取dom元素和操作实现的相关资料,需要的朋友可以参考下2023-06-06
vue中axios的封装问题(简易版拦截,get,post)
这篇文章主要介绍了vue中axios的封装问题(简易版拦截,get,post),需要的朋友可以参考下2018-06-06
require.context是webpack提供的一个api,通常用于批量注册组件,下面这篇文章主要给大家介绍了关于vue require.context()用法的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下2023-04-04
Vue Mock.js介绍和使用与首页导航栏左侧菜单搭建过程
Mock.js是一个模拟数据的生成器，用来帮助前端调试开发、进行前后端的原型分离以及用来提高自动化测试效率，这篇文章主要介绍了Vue Mock.js介绍和使用与首页导航栏左侧菜单搭建,需要的朋友可以参考下2023-09-09
这篇文章主要介绍了vue中的provide / inject 有什么用处,非常不错，具有一定的参考借鉴价值，需要的朋友可以参考下2019-11-11
这篇文章主要为大家详细介绍了vue实现分页栏效果，分页栏设计的步骤与实现方法，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2019-06-06
这篇文章主要介绍了vue3将通用组件注册成全局组件的方法，本文通过示例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下2023-08-08
Console 对象提供了浏览器控制台调试的接口。在不同宿主环境上它的工作方式可能不一样，但通常都会提供一套共性的功能，本文主要总结了Console的一些高级用法，感兴趣的小伙伴可以参考一下2023-04-04
最新评论