1.安装nodejs
2.npm镜像npm install -g cnpm --registry=https://registry.npm.taobao.org
3.安装vue-cli.cnpm install vue-cli -g //全局安装 vue-cli
4.创建项目vue init webpack ”项目名称“
5.进入项目名称目录,cnpm start运行
1.使用iview
(1)安装cnpm install --save iview
(2)使用
import iView from 'iview'
import 'iview/dist/styles/iview.css' // 使用 CSS
Vue.use(iView)片
2.使用axios
1):npm install
2):npm install vue-axios --save
3):npm install qs.js --save //这一步可以先忽略,它的作用是能把json格式的直接转成data所需的格式
mian.js调用
import Vue from 'vue'
import axios from 'axios'
Vue.prototype.$axios = axios //全局注册,使用方法为:this.$axios
Vue.prototype.qs = qs //全局注册,使用方法为:this.qs
用例
this.$axios({
method:'post',
url:'api',
data:this.qs.stringify({ //这里是发送给后台的数据
userId:this.userId,
token:this.token,
})
}).then((response) =>{ //这里使用了ES6的语法
console.log(response) //请求成功返回的数据
}).catch((error) =>
console.log(error) //请求失败返回的数据
})
3.使用vue-router
方案1:添加依赖,自行下载
"dependencies": {
"stylus": "^0.54.5",
"vue": "^2.5.2",
"vue-router": "^3.0.1"
},
方案2 :cnpm方式下载
npm install vue-router --save
用法:
import Vue from 'vue';
import App from './App';
import VueRouter from 'vue-router';
Vue.use(VueRouter);
4.配置代理服务器
修改 config/index.js。proxyTable是代理服务器设置项。以下为例,axios请求遇到/api。则会把/api替换成http://localhost/api/*********
proxyTable: {
'/api': {
target: 'http://localhost',
changeOrigin: true,
pathRewrite: {
'^/api': '/api'
}
}
},
`
基本环境就有了,自行设计吧