100%解决Vue-Cli(脚手架)安装及失败问题

首先，先介绍如何安装，再说明失败如何解决，若查询失败原因直接跳到2

1.安装Vue-Cli(脚手架)

1.1什么是Vue Cli？

Vue CLI，全称为 Vue Command Line Interface，是一个基于 Vue.js 进行快速开发的完整系统。它通过提供可选插件来增加项目的规模，同时还提供了创建向导式的用户界面，帮助我们快速生成一个 Vue.js 项目。

Vue CLI 的主要特点如下：

快速创建 Vue.js 项目的向导式用户界面：我们只需要按照界面上的步骤一步步操作，就可以快速创建一个 Vue.js 项目。
支持自定义配置：Vue CLI 提供了多种配置选项，开发者可以根据自己的需求进行选择和配置。
支持插件扩展：Vue CLI 支持插件化扩展，开发者可以根据需要安装插件，例如路由、状态管理等。
支持开箱即用的工具集成：Vue CLI 集成了很多实用的工具，例如 Babel、Webpack、ESLint 等。
总之，Vue CLI 是一个非常强大的工具，能够极大地提升 Vue.js 开发效率和开发体验，尤其适用于中大型项目的开发。
安装VUE Cli软件

搭建开发环境

1.1.1安装Node.js

首先需要下载Node.js安装包，下载地址可参考：

https://nodejs.org/dist/v16.14.2/node-v16.14.2-x64.msi
https://mirrors.nju.edu.cn/nodejs/latest-v16.x/node-v16.14.2-x64.msi
https://mirrors.tuna.tsinghua.edu.cn/nodejs-release/v16.14.2/node-v16.14.2-x64.msi
Node.js的安装过程没有特别的注意事项，整个安装过程中都可以不必修改任何内容，直至其自动安装完成。
此安装包会自动配置环境变量，安装完成后，可检查npm命令是否可用，在操作系统的命令提示符下执

行以下命令即可：

npm -v

**注意：**你必须在新的命令提示符窗口（安装完Node.js后再打开的窗口）中运行此命令。

1.1.2配置npm源

nmp源（即npm仓库，称之为：registry）默认是境外服务器，在国内使用时，访问速度较慢，通常，在初次使用时，应该将npm源更换为国内的服务器地址，例如使用 https://registry.npmmirror.com作为npm源。

配置npm源的命令如下：

npm config set registry https://registry.npmmirror.com

当配置成功后，可通过 get 命令可查看npm源：

npm config get registry

**注意：**以上命令将显示当前生效的npm源，但并不检查npm源的URL是否有效，所以，即使配置了错误的npm源，也不会提示错误，请认真检查是否配置了正确的URL。

**注意：**无论你使用哪种操作系统，必须保证当前登录的用户具有最高访问权限，例如，在Windows操作系统中，请使用管理员模式的命令提示符，并且，不要使用Power Shell，在Mac OS中，请使用 sudo来执行以上命令。

另外注意：上面的三个截图我是在普通的cmd弹出来的窗口中处理的，后面的截图我切换到管理员权限的命令提示符。

1.2安装 VUE Cli

安装VUE Cli的命令如下：

npm install -g @vue/cli

此过程将从仓库服务器中下载VUE Cli，通常耗时30秒至5分钟左右。

**提示：**如果安装过程中的日志提示更新npm版本，或提示某些软件版本偏旧等，只要没有出现 ERROR字样，均可无视。

**注意：**以上操作仍需要管理权限才可以成功执行。安装完成后，可通过以下命令检验VUE Cli是否安装成功：

vue -V

2.Vue-Cli(脚手架)安装失败问题

一般情况下到上面那里就可以安装成功，但还有一部分特殊情况，会在没有出现 ERROR字样的情况下有下面的情况：

这是因为你安装的 @vue/cli 版本依赖了一些已废弃的模块，但这并不一定意味着 Vue CLI 没有安装成功。以下是一些可能的原因以及解决方法：

2.1. 检查是否成功安装

请确认 Vue CLI 是否成功安装。你可以在命令行中运行以下命令来检查全局安装的包：

npm list -g --depth=0

如果 @vue/cli 出现在列表中，说明它已经成功安装。

确确实实是安装了，但就是出不来vue -V，继续看：

2.2. 检查环境变量

如果 Vue CLI 已安装但命令 vue -V 无法识别，可能是因为 npm 的全局安装目录未添加到系统的环境变量中。你可以尝试以下步骤：

• 检查 npm 全局安装目录：

  npm config get prefix
  

  这将返回 npm 全局安装目录的路径，通常类似 C:\Users\<你的用户名>\AppData\Roaming\npm。

  

• 将目录添加到环境变量：

  • 右键点击“此电脑”，选择“属性”。

  • 点击“高级系统设置”。

  • 在“系统属性”窗口中点击“环境变量”。

  • 在“系统变量”中找到 Path 变量，点击“编辑”。

  • 点击“新建”，然后粘贴刚才获取的 npm 全局安装目录路径。

  • 点击“确定”保存所有更改。

    

    到这里，配好环境变量之后，发现就可以正常出结果了，我现在退出管理员权限的命令提示符，在普通的cmd弹出来的窗口中来处理：

    

    到这里，百分之99的问题已经解决了，但总有那么百分之一的人还没有解决，继续：

2.3. 重新安装 Vue CLI

如果上述方法没有解决问题，尝试重新安装 Vue CLI：

npm uninstall -g @vue/cli
npm install -g @vue/cli

安装完成后，再次运行 vue -V 检查版本。

2.4. 检查系统缓存

如果重新安装了一下，还是没有解决：

清理 npm 缓存和系统缓存，然后重试：

npm cache clean --force

2.5. 使用 npx 命令

如果你不想全局安装 Vue CLI，也可以使用 npx 来运行 Vue CLI 命令：

npx @vue/cli -V

3.终极方法

尝试以上方法后，99.99%的人已经解决了，如果问题仍然存在，那么就不是安装的问题了，肯定是你在哪里操作错了，为了成功率达到100%，直接d我