本章节主要说的是如何完整的搭建一个项目的开发环境
一、安装vue脚手架
首先创建一个文件夹并且在本文件夹的黑窗口(cmd命令进入)安装Vue的脚手架，使用：cnpm i -g @vue/cli 命令进行安装
检查是否安装成功 ：vue --version 命令
二、前端vue项目创建
- 创建前端项目文件夹 vue create 项目名
例如：vue create kigo-web
2.选择Man…(手动安装)
3.选择需要的样式
4.用2.0x
5.Use history mode for router?（是否使用history 模式？）
回复y yes
6.选择Sass/SCSS(with node-sass)模式
7.选择In package.josn
8.是否保存模板 回复n (no)
9.等待安装，等待安装结束之后 cd 进入项目目录，例如：cd kigo-web，进入项目目录之后执行命令cnpm i axios --save ，这个命令是用来发ajax请求的。 10.安装所需要的UI组件库 例如：cnpm i element-ui --save ， cnpm i vant --save
三、后端项目创建
1.在项目目录下打开黑窗口
- express 项目名
例如express kigo-admin - cd kigo-admin
进入kigo-admin之内 - 执行cnpm i 命令 安装所有的依赖
- 执行cnpm i mongoose --save命令操作数据库
- cnpm i cors --save 解决跨域问题
整个项目完成之后需要更改一些配置
1.在后端package.json中将“start”中的node改为nodemon
2.在后端app.js文件中引入cors解决跨域问题
到现在你的项目开发前准备工作就已经完成啦，然后通过你前后端的命令窗口启动就可以了，前端执行命令npm run serve,后端执行命令np start。
到现在就到了整理项目的阶段了
前端项目整理：
- 首先用编辑器打开你的前端文件夹，可以先将App.vue中的内容全部删掉，然后输入个vue模板，创建一个div，内容写一个hello来进行测试一下
- 然后把views下面的页面都删掉
- router删除后的内容如图所示
- components(主键)中的内容也删掉
- main.js中要导入element-ui 以及vant ui，还要用axios做全局的注册。
- main.js配置完成之后，以后需要用axios直接this.$axios即可使用
后端项目的整理
- 更改routes中index.js的内容即可
