目录

注意事项

1、创建vue脚手架

2、项目启动

3、安装路由VueRouter

4、安装axios【需要自行安装】

5、安装vuex

6、安装ElementUI【自行安装】

7、打包【提交项目】

---

注意事项

components文件夹：主要写会重复用到的模块
views：写页面
文件命名格式：以大写开头，且至少两个单词，eg：ClassPage.vue
安装配置时：要先进入到正确的项目文件夹下

---

1、创建vue脚手架

不要出现中文名

vue create lean-router

2、项目启动

不一定是如下，具体项目配置有具体启动命令

cd lean-router
npm run serve

3、安装路由VueRouter

（1）可以在构建VueCLI脚手架时自动安装配置

（2）也可自行安装，命令如下

npm install vue-router@3
npm run serve

4、安装axios【需要自行安装】

（1）安装

npm install axios

（2）封装 

①src文件夹下新建=》request文件夹=》request.js

import axios from 'axios';
创建实例
const instance = axios.create({baseURL:"",timeout:1000,//超时则中断请求
})export default instance

②src文件夹=》新建api文件夹=》about.js、home.js、index.js

import instance from "@/request/request.js"

export function Rainbow(params){return instance({url:'/caihongpi/index',method:"GET",params:params,//params})
}export function Flatterer(data){return instance({url:'/tiangou/index',method:"POST",data,headers:{'content-type':'application/x-www-form-urlencoded'}})
}

5、安装vuex

（1）安装

npm install vuex@3

（2）配置

进入main.js文件，进行vuex的引入和使用配置

import vuex from "vuex";
Vue.use(Vuex);

6、安装ElementUI【自行安装】

（1）安装

npm i element-ui -S

（2）配置

进入main.js文件，进行ElementUI组件库的引入

import ElementUI from 'element-ui';    //引入
import 'element-ui/lib/theme-chalk/index.css';    //引入Vue.use(ElementUI);    //使用

7、打包【提交项目】

npm run build