我学习和使用angular也有两年了。期间也接触过react，vue，简单地学习过。现在也想好好学一下vue，于是我在这里记录一下学习的大概过程。
安装vue-cli
之前用嵌入script标签的方式撸过一遍vue的一些特性，包括vue-router。这里我使用vue-cli的方式来安装一下。
1 | npm install --global vue-cli |
生成vue项目
1 | vue init webpack vuecms |
命令中的webpack是指生成一个基于webpack的项目。
vue-cli生成项目过程的最后一个会提示你选择是否自动执行npm install，我选择了yes，或者cd到项目目录下运行npm install安装依赖也可以。安装依赖的时间有点长，请耐心等待！
启动vue项目
1 | npm start |
该命令会执行npm run dev，默认端口是8080，我个人喜欢改端口，在dev脚本后加上–port=3200即可。
打包vue项目
1 | npm run build |
运行该命令后，会执行build.js。webpack的配置文件主要涉及build和config两个目录，后面修改这两个目录中的文件应该可以进行定制。
我们build项目之后，直接把index.html拖到浏览器中是不可以访问的。要么放在服务器上进行访问，要么就是使用http-server进行测试。
1 | npm install -g http-server |
安装http-server后，我们cd到dist目录下，启动http-sever
1 | // 键入这个命令即可启动http-server服务 |
然后我们就可以通过http://127.0.0.1:8080/index.html访问打包后的项目了。
扫一扫下方小程序码或搜索Tusi博客，即刻阅读最新文章！
