Apollo
Nuxt.js module to use vue-apollo (integrates graphql-tag loader to parse
.gql
&.graphql
files)
Setup
Install apollo module:
npm install --save @nuxtjs/apollo
Add @nuxtjs/apollo
to modules
section of nuxt.config.js
{
// Add apollo module
modules: ['@nuxtjs/apollo'],
// Give apollo module options
apollo: {
clientConfigs: {
default: '~/apollo/client-configs/default.js'
}
}
}
Options
- clientConfig:
Object
Config passed to ApolloClient- default:
String
- [otherClient]:
String
orObject
- default:
Example (nuxt.config.js
):
module.exports = {
modules: ['@nuxtjs/apollo'],
apollo: {
clientConfigs: {
default: '~/apollo/client-configs/default.js',
test: '~/apollo/client-configs/test.js'
}
}
}
Then in ~/apollo/client-configs/default.js
:
import { ApolloLink } from 'apollo-link'
import { HttpLink } from 'apollo-link-http'
import { InMemoryCache } from 'apollo-cache-inmemory'
export default (ctx) => {
const httpLink = new HttpLink({ uri: 'http://localhost:8000/graphql' })
// auth token
let token = ctx.isServer ? ctx.req.session : window.__NUXT__.state.session
// middleware
const middlewareLink = new ApolloLink((operation, forward) => {
operation.setContext({
headers: { authorization: `Bearer ${token}` }
})
return forward(operation)
})
const link = middlewareLink.concat(httpLink)
return {
link,
cache: new InMemoryCache()
}
}
Usage
See Official example and vue-apollo.
Upgrade Guide apollo-client v1 => v2
Version 3 of this module is using apollo-client 2.x. You need to make sure to update all your middle/afterware according to the upgrade guide of apollo-client. Check this source for a reference: https://github.com/apollographql/apollo-client/blob/master/Upgrade.md