Table of contents
4. Install axios [you need to install it yourself]
6. Install ElementUI [self-installation]
Precautions
components folder: mainly write modules that will be used repeatedly
views: write pages
File naming format: start with uppercase, and at least two words, eg: ClassPage.vue
When installing and configuring: first enter the correct project folder
1. Create vue scaffolding
Do not appear Chinese name
vue create lean-router2. Project start
Not necessarily as follows, the specific project configuration has a specific startup command
cd lean-router
npm run serve3. Install routing VueRouter
(1) The configuration can be automatically installed when building VueCLI scaffolding
(2) You can also install it yourself, the command is as follows
npm install vue-router@3
npm run serve4. Install axios [you need to install it yourself]
(1) installation
npm install axios(2) Encapsulation
① Create a new folder under the src folder = "request folder = "request.js
import axios from 'axios';
创建实例
const instance = axios.create({
baseURL:"",
timeout:1000,//超时则中断请求
})
export default instance②src folder = "new api folder = "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. Install vuex
(1) installation
npm install vuex@3(2) Configuration
Enter the main.js file to introduce and configure vuex
import vuex from "vuex";
Vue.use(Vuex);6. Install ElementUI [self-installation]
(1) installation
npm i element-ui -S(2) Configuration
Enter the main.js file to import the ElementUI component library
import ElementUI from 'element-ui'; //引入
import 'element-ui/lib/theme-chalk/index.css'; //引入
Vue.use(ElementUI); //使用7. Package【Submit project】
npm run build