VueCli脚手架（一）什么是vue cli脚手架，Vue Cli 安装教程，包括node.js 的安装，vue项目结构的介绍

目录

• 什么是cli
• 什么是vue cli
• node.js 安装
• 安装脚手架
• 项目结构的介绍
• 创建第一个vue cli的项目

什么是cli

在这里插入图片描述

什么是vue cli

中文网站 https://cli.vuejs.org/zh/guide/

在这里插入图片描述

node.js 安装

确保电脑安装了node.js 的环境

在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

以上做的其实就是安装了node.js 的环境，这个就相当于前端的服务器，配置了淘宝镜像，让我们下载东西快一点。还有就是配置了安装文件，也就是我们下载的东西要放到哪里，我们就自定义了一个文件夹，里面放的就是我们下载的依赖。

安装脚手架

官网 https://cli.vuejs.org/zh/guide/ 这个里面是vue3版本

vue2 版本是https://github.com/vuejs/vue-cli/tree/v2#vue-cli–

我们现在使用的是2版本

在这里插入图片描述

在这里插入图片描述

项目结构的介绍

在这里插入图片描述

创建第一个vue cli的项目

确保电脑已经安装了node.js 和脚手架vue cli

在vs软件里面打开一个随便的文件夹，并且打开终端，就像下面这样

在这里插入图片描述

在这里插入图片描述

这样我们就创建了vue的项目了

在这里插入图片描述

现在我们要启动这个项目

我们进入这个项目，并且执行命令

在这里插入图片描述

看见出现了这个最后的地址，那么在浏览器输入这个地址，就可以看见这个项目了。

在这里插入图片描述