全局安装nuxt_nuxt 项目安装及环境配置

modules: ['@nuxtjs/style-resources'],

build: {

styleResources: {

less: ['assets/less/_theme.less','assets/less/_mixins.less']

}

}

axios篇

使用nuxt提供的axios插件,没有安装的时候安装下npm install @nuxtjs/axios

在nuxt.config.js中进行配置

plugins: ['@/plugins/axios',

{src: '@/plugins/common.js', ssr: false}

],modules: ['@nuxtjs/axios',]

创建 plugins/axios.js 并定义axios的拦截器，定义请求的各个阶段需要进行的处理

export default function({ $axios, redirect }) {//request interceptor

$axios.interceptors.request.use(

config=>{//do something before request is sent

returnconfig

},

error=>{//do something with request error

returnPromise.reject(error)

}

)

$axios.onRequest(config=>{

console.log('Making request to ' +config.url)

})//response interceptor

$axios.interceptors.response.use(/**

* Determine the request status by custom code

* Here is just an example

* You can also judge the status by HTTP Status Code*/response=>{

const res=response.dataif (res.code === 20000) {returnres

}else{

redirect('/404')//if the custom code is not 200, it is judged as an error.

}return Promise.reject(new Error(res.msg || 'Error'))

},

error=>{

console.log('err' + error) //for debug

returnPromise.reject(error)

}

)

$axios.onError(error=>{

const code= parseInt(error.response &&error.response.status)if (code === 400) {

redirect('/404')

}else if (code === 500) {

redirect('/500')

}

})

}

创建 libs/request.js 并封装get,post