vue-cli是什么？

---

首先是了解下vue-cli 是什么，vue-cli是vue.js的脚手架，用于自动生成vue.js+webpack的项目模板，使用方法后面讲

开发环境的搭建

---

安装node.js

vue-cli安装首先需要下载并安装依赖库那就是node.js 跟 npm, 建议版本是npm 3.0以上 node.js版本8.0以上才能很好地体验vue-cli的功能。

Node.js官网

安装完成后在终端可以测试下是否成功安装好 node -v，安装node后npm也随之安装好顺便查下npm的版本 npm -v，要是npm 版本3.0以下 在终端上输入这条命令 npm -g install npm来升级。

安装cnpm

由于资源的限制 安装npm依赖包经常是失败的 出现这种状况建议使用 npm的国内镜像cnpm，

CNPM下载安装

安装命令：npm install -g cnpm -registry = https://registry.npm.taobao.org

安装vue-cli

官网

命令：npm install -g vue-cli或者 npm install -g @vue/cli 这是3.0版本 官网上有详细的 所以我就不多说了 喜欢自己用哪个就选哪个 但我不推荐3.0

创建项目

---

以上步骤全都做完之后，在终端里输入vue init webpack xxx 来创建项目(xxx是项目名称，要是vue-cli 版本3.0以上那就 vue create xxx来创建项目)，然后在终端打开项目目录输入npm run dev来启动项目(要是3.0以上就npm run serve)最后会显示项目在8080端口跑上了：localhost:8080

遇到问题：

解决方法：需要代理上网 或者 换淘宝资源(cnpm) 或者 创建项目的时候把 e2e的那个选项输入n

打包

---

打包是部署服务器的第一项事，在终端打开项目目录输入npm run build来打包项目，输入完成后会在目录上自动创建dist的文件夹那就是打包的内容就把这个dist文件夹扔到服务器上即可，

遇到问题：空白页面

解决方法：项目目录里config->index.js有这个文件需要进这个文件 查看下assetsPublicPath的选项，这个文件里 2处有这种选项把两个属性改为"./"就好。

我也是初学者只是学到的分享下第一次写简书多多指教，希望大家爬坑愉快。