Vue-cli脚手架搭建vue项目

搭建项目前保证已安装了node
第一步：全局安装vue-cli

$ npm install -g vue-cli

安装后检验是否安装成功

$ vue 

如果出现如下图信息则说明安装成功

image.png

第二步：新建项目project2

$ vue init webpack project

image.png

参数说明：
“Project name”：这个是项目名称，默认是输入时的那个名称，想改的话直接输入修改，也可以直接回车

“Install vue-router”:是否需要vue-router，这里默认选择使用，这样生成好的项目就会有相关的路由配置文件

“Use ESLint to lint your code”:是否使用ESLint，刚才说了我们这个项目需要使用所以也是直接回车，默认使用，这样会生成相关的ESLint配置

“Setup unit tests with Karma + Moch?”: 是否安装单元测试。由于我们现在还没有单元测试，所以这里选择的是”N”，而不是直接回车哦

“Setup e2e tests with Nightwatch”：是否安装e2e测试，这里我也同样选择的是“N”

第三步： 安装完成后

image.png

输入命令

$ cd project2
$ cd run dev

执行完命令后出现

image.png

我们在浏览器输入网址： http://localhost:8081
就可以成功访问啦！

image.png

一个简单的vue项目就搭建完成了！