利用npm \ yarn 安装vue脚手架不成功的解决方案

利用yarn / npm 安装vue脚手架时出现问题

1. npm 安装vue脚手架

• 全局安装命令

  npm install -g @vue/cli@4.5.12

• 安装完毕，输入vue -V 查询版本号，如果查到，则安装成功，否则失败

• 在C盘下，搜索 vue.cmd，如果存在这个文件，那么vue-cli已经安装成功，只需要该地址存在环境变量中（系统和用户都可）。

• 如果不存在这个文件，那么就可以先卸载，重新安装

  npm uninstall vue-cli -g

  npm install -g @vue/cli

• 具体操作如下yarn安装vue脚手架，原理、操作基本一致

2. Yarn 安装vue脚手架

• 全局安装命令

  yarn global add @vue/cl@4.5.12

• 注意 : 如果半天没动静 ( 95%都是网速问题 ) , 可以ctrl c

  1. 停止重新来
  2. 换一个网继续重来

• 安装完毕

  

• 查看vue脚手架版本。（如果版本号出现，则安装成功，否则失败）

  vue -V

  [外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-sUYtD4Ap-1656335941099)(D:/%E7%AC%94%E8%AE%B0/%E5%89%8D%E7%AB%AF/node/202206272047612.png)]

• 如果失败，只有两种可能：

  1. 安装vue-cil 失败。
  2. 需要手动添加环境变量。

  • 先在依赖位置里面查找是否出现vue.cmd

  • cmd 中输入yarn gloabl bin

  • 将会得到yarn的全局bin路径

    例如：C:\Users\Administrator\AppData\Local\Yarn\bin

  • 然后按该路径查找文件中是否含有vue.cmd文件

    

  • 如果可以找到，则安装没问题，只需要配置一下环境变量就可以了

  • 复制上述查找到的yarn的全局bin路径

  • 打开环境变量，找到如图位置

    

  • 将yarn的全局bin路径添加到该变量中

    

  • 配置结束，关闭cmd重启，然后重新输入 vue -V,即可得到版本号

    

  • game over