Vue 搭建脚手架全过程

前期的学习，使用Vue可以直接引入官方的CDN来进行学习，后期做项目之后我们就必须要自己搭建脚手架来了，

脚手架搭建流程

1.下载一下Node.js，下载链接https://nodejs.org/zh-cn/

2.下载好之后直接安装即可

3.在终端测试一下是否安装成功

--3.1 windows电脑 打开命令行(快捷键win + R) 输入 cmd

--3.2 在命令行中输入 node -v 会显示nodejs的版本，显示版本就是安装成功 确认一下版本号在6.9以上

--3.3 继续在命令行中输入 npm -v 也可以看到版本号 看一下版本在3.10以上即可

4. 正式安装脚手架

--4.1 在命令行工具中 第一步安装全局的vue-cli

        输入 npm install --global vue-cli(我这里用的国内的镜像 是cnpm 效果是一样的)

  等待一会让他安装，成功之后我们可以测试一下

 输入 vue --version 也会自动显示一个版本号，有版本号就说明安装成功了

 

--4.2 确认好之后，我们就可以通过命令行切换到自己要安装的位置

        比如我这里是在 E:\JavaScript-Vue\Vuecli 这里

        在命令行中切换到这个路径即可 

         切换到这个文件夹之后，就可以进行下一步操作

         输入 vue init webpack XXX(这里XXX是你自己创建的文件夹名称)，

         比如我的叫bilibili-vue 那么就输入 vue init webpack bilibili-vue

这个时候稍微等一下，会自己下载模板，好了之后我们进行一些配置

Project name(bilibili-vue) 这是我自己创建的文件名称  如果默认就直接回车键  如果想改的话就重新输入一个名字

这里我就默认了 回车键

下面一直回车键 到显示  Runtime+Compiler这里还是按下回车键

之后的一系列选择全部选择 n(No)就可以

然后会出现三个选项，选择最后一个myself 那个自己配置就OK了

然后命令行会提示你可以cd 到你的新建的文件夹了，于是我这里写了 cd bilibili-vue 注意别写错啦

然后就剩下最后一步了输入 npm install(我这里用的是cnpm效果一样的没有影响的)，然后等待安装好就OK了

到这里就全部大公告成了，大家可以打开自己的文件下看下，已经多了一个新创建的文件了，可以在VSCode或者其他编译器打开做Vue项目啦！