vue脚手架提示没有安装（Vue脚手架基础Node.js安装）

关于Vue

1. Vue.js（读音：/vjuː/, 类似于：view） 是一套构建用户界面的渐进式框
2. Vue.js的官方网址是：https://cn.vuejs.org/index.HTML

传统的前端开发框架大多是基于DOM（Document Object Model：文档 对象模型）的，在操作时，需要关心被操作的页面元素，甚至这些页面元 素的层级结构，核心思想是：先根据DOM找到对应的页面元素，然后再 进行相关操作，例如设计其样式，或配置某个事件

Vue则是将必要的页面元素的相关属性（例如页面元素的样式、控件的值、 页面元素的事件等）与数据进行绑定，当实现绑定后，就不再需要关心页 面元素本身了，只需要关心各个数据即可，从而避免了大量繁琐的DOM 操作，也实现了页面设计与数据处理的分离

关于Vue CLI

• Vue CLI通常称为“VUE脚手架”，它是一个专门为单页面应用快速搭建 繁杂的脚手架，它可以轻松地创建新的应用程序而且可用于自动生成vue 和webpack的工程模板
• Vue CLI相关文档的官方网址是：https://cli.vuejs.org/zh/guide/
• Vue CLI是由VUE提供的一个官方客户端（client），专门为单页面应用 快速搭建繁杂的脚手架

所谓的单页面：指的是在工程中，理论上只有1个HTML页面，只不过这 个页面的所有内容都是可以动态更新的，你随时可以使用新的页面内容替 换原有的内容，并且，你还可以使得URL一并更新，从用户体验上来说， 这种单页面应用与传统的前端应用并没有什么不同

解释：单页面

【注意】在使用传统模式开发的前端工程中，各个页面是相对独立的， 甚至你可以在本地硬盘上找到对应的html文件并双击直接打开它，而Vue CLI工程与一个Web应用程序一样，是需要启动服务才可以访问的，一定 程度上，它的上手难度会更大一些，但是在中大型应用程序的开发中，它 在开发效率、管理和维护成本上有更大的优势

单页面应用的工程中需要一定的配置，对配置文件的位置也有一定的要求， 整体工程结果并不像传统的前端应用工程那么自由，所以，手动创建这种 应用的成本较大，而Vue CLI则可以自动生成vue.js webpack的工程模 板，是为现代前端工作流提供了Batteries-included（自含全套工具集） 的构建设置，只需要几分钟的时间甚至更短的时间就可以运行起来

由Vue CLI创建的工程，默认即是热部署的，当你启动了这个工程（非打包后提供工程）的服务后，在绝大部分情况下， 修改源代码后并不需要重新启动服务，即可体验到修改后的内容

关于npm

npm的全称是：Node Package Manager，可译为“Node包管理器”

图

在早期没有npm时，如果需要在前端工程中使用某些框架（例如jQuery、 Bootstrap等），需要找到相关的官网或资源站点，要么下载这些框架的 文件，要么使用cdn在线引用这些文件，其过程相对烦琐，因为这些框架 的具体表现可能不只是一个文件，如果下载，只能下载打包后的文件并自 行解压缩，如果在线引用，则需要自行添加多条源代码进行引用，同时， 是这些框架也是在不停维护和更新的，即使开发人员在本地已经下载过这 些框架文件，当需要新版本的框架时，又需要重新下载，或者上网搜索最 新的cdn引用地址。

为了解决这个问题，Isaac Z.Schlueter使用运行在Node. js之上的 JavaScript语言开发了npm，它允许配置一个仓库，并将大量框架的文件放在了npm仓库中，并提供了一系列的管理命令，最终，开发人员只需 要使用npm的命令，就可以在线获取到框架文件。通常，框架的文件会自 动的存储到工程目录下，并在工程的配置文件中进行注册，开发人员只需 要在主配置中进行导入及一些简单的配置就可以开始使用这些框架。

【注】一定程度上，npm与Maven或Gradle是比较相似的

安装Node.js

1. 为了使用npm，首先需要下载node.js安装包，下载地址可参考：–> https://nodejs.org/dist/v16.14.2/node-v16.14.2-x64.msi
2. Node.js的安装过程没有特别的注意事项，整个安装过程中都可以不必修改任何内容，直至其自动安装完成

安装node.js

• 此安装包会自动配置环境变量，安装完成后，可检查npm命令是否可用， 在操作系统的命令提示符下执行以下命令即可：

//查看node.js安装的版本 npm -V //执行以上命令后，将会显示版本号，如下： C:\>npm -v 8.5.0 //注意： 这个命令必须在新的命令提示窗口（安装完Node.js后再打开窗口）运行此命令

配置npm源

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

//配置npm源的命令如下： npm config set registry https://registry.npm.taobao.org //当配置成功后，可以通过get命令查看npm源 npm config get registry //运行查看之后 显示： https://registry.npm.taobao.org

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

安装Vue CLI

//安装Vue CLI的命令如下 npm install -g @vue/cli //-g表示全局安装，则当前操作系统中所有用户均可使用，且自动配置Vue环境变量。 //此过程将从仓库服务器中下载Vue CLI，通常耗时30秒至5分钟左右。 //提示：如果安装过程中的日志提示更新npm版本，或提示某些软件版本偏 旧等，均可无视。 //注意：以上操作仍需要管理权限才可以成功执行。 //通过以下命令检验Vue CLI是否安装成功： vue -V //执行后显示如下： @vue/cli 5.0.3

学习记录，如有侵权请联系删除。