vue——cli脚手架的搭建

**

前端搭建vue-cli项目的两种教程

**

第一种搭建方法（默认）

1、打开node.js官网https://nodejs.org/en/下载当前版本node.js并安装到电脑中，安装方式为"无脑安装之下一步"

安装完成后检验是否安装node.js:
win+r输入cmd打开dos窗口输入node -v回车之后会显示node.js版本号，证明电脑安装成功了！
npm集成在node.js中，在dos窗口输入npm -v回车之后会显示npm版本！

2、利用淘宝镜像安装cnpm，在命令行中输入npm install -g cnpm --registry=https://registry.npm.taobao.org，
安装成功之后输入cnpm install -g vue-cli来安装vue-cli脚手架

3、开始创建vue项目，例如要在D盘创建vue项目。
dos命令行输入D: 进到D盘目录cd D:vueProject进入vueProject文件夹，输入vue init webpack projectName创建新的vue项目，其中projectName为项目名称，可设为任意名称。
回车之后会出现vue项目的配置属性：
Project name为项目名称
Project description为项目描述
Author为项目作者
Vue build为webpack配置文件默认回车就好
Install vue-router?是否安装路由配置
Use ESLint to lint your code?为eslint校验js代码语法的插件(可装可不装)
Set up unit tests?为设置测试单元默认No就可以
Setup e2e tests with Nightwatch?为vueE2E测试
Should we run ‘npm install’ for you after the project has been created?(recommended)默认npm安装

4、安装项目依赖
dos窗口定位到项目路径cd D:vueProject\projectName，然后输入cnpm install安装项目所需依赖包资源。

5、安装成功之后运行
dos窗口定位到项目路径cd D:vueProject\projectName，然后输入npm run dev回车运行项目，项目路径为http://localhost:8080

**

第二种使用ui搭建

**
1 Vue 脚手架的基本用法
介绍：（Vue脚手架：命令行工具，用于快速生成Vue项目基础架构，简化程序员创建Vue项目的过程）
安装： npm install -g @vue/cli
1 基于交互式命令行的方式，创建新版vue项目：vue create my-project

2 基于图形化界面的方式，创建新版vue项目：vue ui，
要创建一个新的项目，点击中间的"Create"按钮：选择路径后创建，默认下一步

默认下一步，完成。
然后vscode打开运行。

下次打开可以cmd，输入vue ui

然后他会弹出


然后根据自己的需求，可视图开发，管理，编辑，下包，配置等。