下面来看api模块部分，以home-api为例，看代码
/**
* 引入fetch、baseUrl
* @param params
* @returns {*}
*/
import {fetch, baseUrl} from 'config/index'
// 登录接口
export function loginUserNo(params) {
return fetch(`${baseUrl}/root/login/checkMemberLogin`, params)
}在文件里引入fetch方法和baseUrl，这里为什么可以简写成’config/index’呢，需要在’build/webpack.base.conf.js’里添加以下代码，后面引入api同理
这里export登录方法loginUserNo之后，就可以在组件里面使用这个登录方法了，如下代码
import * as homeApi from 'api/home-api' // 引入api
import { ERR_OK } from 'config/index' // 引入请求成功状态
// 请求方法
login() {
let params = {
password: '*******',
storeNo: '',
userName: '*********'
}
homeApi.loginUserNo(params).then((res) => {
let {data} = res
if (data.success === ERR_OK) {
// 请求成功操作，存储token
localStorage.setItem('token', data.value.token)
} else {
}
}).catch(() => {
})
}
}在点击登录之后执行登录方法，就可以调用请求方法了，但是这里还有一个问题
关于数据请求，避不开的一个老生常谈的问题就是跨域，同样的上面点击登录也会涉及到跨域无法请求的问题，不过好在vue-cli里面已经配置了解决跨域问题的模块，我们可以在config/index.js里面配置以下要代理的地址，如下图
将以root开头的api转发出去，将地址指向接口地址，这样就解决了跨域的问题。
到此，vue全家桶的引入及应用就基本完成了，但是到目前为止这个项目还只能进行简单的路由跳转、状态存储以及数据请求，而我们的目标是一个移动端应用框架，接下来我们还要解决如下几个问题
移动端适配问题
移动端ui框架的引入
项目组织架构的优化问题
下面我们就先从移动端适配问题入手
项目的适配
因为移动端设备屏幕大小，屏幕比例什么的差别比较大，所以移动端项目的适配问题就显得尤为重要，这里我们主要使用flexible.js进行适配，关于flexible.js，不懂得话可以点这里，这里我们以最常用的750*1334的尺寸为例
引入flexible.js，在main.js里引入flexible.js文件，可将flexible.js作为静态文件放在最外层static文件夹里引入，如下图
使用less作为css预处理器，首先安装less
（1）安装less和less-loader
