vue-cli升级成功但显示之前版本的解决方案🚀

931 阅读3分钟

前言☀️

  • 出于一些原因需要升级最新的vue-cli版本,但其间遇到的问题真的让人头疼
  • 最后通过找寻资料和配置成功解决,接下来分享一下我遇到的问题和解决方法

遇到的问题😢

  • 首先一开始我的版本是4.2.3,想要升级理所当然想到使用更新命令行
npm update -g @vue/cli // 升级vue-cli到最新版
vue -V // 查看vue-cli版本
  • 但是问题来了 我更新了之后查询版本还是原来的版本

image.png

  • 得 我删了再装还不行吗😡
npm uninstall vue-cli -g  //卸载vue-cli旧版本
npm install -g @vue/cli  //安装新版本
  • 问题又来了 这我明明用命令行删掉重装了呀,怎么还是原来的版本,不管重复了多少次都是这样
  • 于是 我试着删除后查询版本

image.png

  • 一脸疑惑 为什么删除掉了之后还可以查到版本?😭
  • 这时候我突然想到之前前段时间配置了npm安装的全局模块

image.png

  • 之前通过配置更改了npm安装全局模块后存放的路径,具体修改方法可以访问这位博主的链接
  • 突然明白 我的低版本的vue-cli是在配置全局模块之前安装的 现在我卸载的vue-cli和安装的vue-cli都是在...\node.js\node_global\node_modules这里进行操作的
  • 为了验证 我再试着安装和卸载,发现还真是,安装后在这个文件夹多了@vue

image.png

  • 一切都明朗起来,意思是我现在执行的操作都没有影响到原来的vue-cli,那么我只需要找到之前vue-cli存放的地方将他删除再重新安装vue-cli就ok

开始解决👊

  • 查阅资料可知
  • npm一些全局的软件包,通常默认会保存在以下位置:C:\Users\username\AppData\Roaming\npm\node_modules
  • 如果是之前自己有配置路径,不知道安装到了什么位置,可以使用命令npm root -g进行查询
npm root -g //查询安装位置
  • 终于给我找到了,原来你藏在这里

image.png

  • 把这个文件夹删除后满怀期待运行vue- V image.png
  • 命令行报错了,应该是有些vue的配置文件没有删干净,返回之前的文件夹将这些删除 image.png
  • 接下来就好办了重新安装vue-cli
npm update -g @vue/cli // 升级vue-cli到最新版
vue -V // 查看vue-cli版本

image.png

大功告成!!!!!!升级成功

写在最后

  • 首先找到之前这个版本的包是存放在哪个地方,其次把相关配置和包删除,最后重新安装所需要的配置
  • 我反思了一下为什么会出现存放地址混乱的问题,是我一开始安装node的时候没有合理配置
  • 用了一段时间才想起来配置就会出现以前安装的包存放到其他地方的问题
  • 所以大家还是好好配置一下环境不然出现我这种问题就尴尬了 配置可以参考这位博主分享的博客
  • 如果您觉得这篇文章有帮助到您的的话不妨点赞支持一下哟~~😛