第一篇，希望可以写一些真正帮到大家的东西，希望所有同学脱离迷茫状态，欢迎指教。
使用Vue CLI是构建Vue项目的有效途径，首先我们要 安装Vue CLI。
一. 安装 Vue CLI
Vue CLI 对Node.js的版本是有要求的，需要最好8.11.0+的Node.js版本
-
查看Node.js版本
$ node -v
如果返回v8.11.0以上的版本信息，你可以跳过下一步骤，如果是低版本，我们这里就需要下载其他版本的Node.js，可以使用nvm管理多个版本的Node.js - 安装nvm版本管理工具
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.32.1/install.sh|bash
如果在mac系统上，确保自己安装了Xcode，并且只有一个版本的Xcode
但是依旧可能会遇到如下报错
error: RPC failed; curl 18 transfer closed with outstanding read data remaining
在命令行输入以下内容可以解决
git config --global http.postBuffer 524288000
成功后，可以通过nvm命令安装指定版本的Node.js
nvm install [nodeversion]
例如我们现在要安装8.11.1版本的
nvm install v8.11.1
通过nvm我们可以切换Node.js版本，指定某一版本来使用
nvm use v8.11.1
此时执行$ node -v 会返回当前的版本号v8.11.1
- 下载Vue CLi安装包
npm install -g @vue/cli
通过vue --version查看当前版本，现在我们安装的是3.0.0-rc.3版本
二. 创建项目
Vue cli 更新到第三版本，拥有自己的官网了https://cli.vuejs.org/
- 创建名为
hello-world的项目
vue create hello-world
-
系统已经为你选择了默认预设
选择了Babel + ESLint默认预设
-
你也可以手动选择需要用到的工具
手动选择
这里可以通过 “空格” 切换是否选择该选项
顺便说下各个工具的作用
Babel： 用于将ES6语法转换为ES5，也就是说，我们不必担心现有的环境是否支持ES6语法，Babel会帮我们转换成ES5
TypeScript：可以将它理解为更严格的JavaScript，Typescript会严格规定数据类型，包括返回值的类型
Progress Web App (PWA) Support：谷歌推出的PWA网页版APP
Router：是否要用Vue Router
VueX：是否要用VueX
CSS Pre-processors是否要用到CSS超级，现在常用的一般是LESS，SASS和Stylus
Unit Testing是否用到模块测试
E2E Testing同样是用来代码测试的，现在前端程序能做的事情越来越多，JS越来越复杂，测试还是有好处的。
PS：现在也可以通过可视化界面来构建Vue项目，具体可以看官网。
三.运行程序吧
控制台
npm run start
浏览器打开地址http://localhost:8080/
项目就会成功运行啦。
网友评论