Comments (4)
Hey,
Ran in to this when looking for a solution, this is how I did it:
In nuxt .config.js
const { createApolloFetch } = require('apollo-fetch')
module.exports = {
...
generate: {
routes: function () {
const uri = 'yourendpoint'
const apolloFetch = createApolloFetch({ uri })
const query = `
query allBlogPosts{
allBlogPosts{
slug
}
}
`
const staticRoutes = [
'/policies/disclaimer',
'/policies/privacy',
'/policies/terms'
]
return apolloFetch({ query }) // all apolloFetch arguments are optional
.then(result => {
const { data } = result
const dynamicRoutes = data.allBlogPosts.map(post => `/post/${post.slug}`)
return staticRoutes.concat(dynamicRoutes)
})
.catch(error => {
console.log('got error')
console.log(error)
})
}
},
from apollo.
@kedarguy thanks for the response, but actually it gets stuck at the first line – it throws an error:
Error: Cannot find module 'apollo-fetch'
I'm using the nuxt apollo module (this repo), so my nuxt.config.js
is the following (more or less, just the corresponding parts):
module.exports = {
modules: [
'@nuxtjs/apollo',
],
apollo: {
networkInterfaces: {
default: '~/apollo/network-interfaces/default.js'
}
},
...
generate: {
routes: function() {
const uri = 'my_api_url'
const apolloFetch = createNetworkInterface({ uri })
const query = `
query Shops($language: language, $category: ShopCategoryParam) {
site(language: $language) {
shops {
by_category(category: $category, pagination: {sort: {field: name}, limit: 100}) {
total
edges {
node {
name
}
}
}
}
}
}
`
return apolloFetch({ query })
.then(result => {
const { data } = result
const dynamicRoutes = data.Shops.by_category.edges.map(node => `/shops/${shop.slug}`)
})
.catch(error => {
console.log('got error')
console.log(error)
})
}
}
}
Do you have any idea how to solve this one? :) Thanks in advance!
from apollo.
looks like you missed the require line
const { createApolloFetch } = require('apollo-fetch')
module.exports = {
...
make sure you install apollo-fetch package from npm
Check out the npm instructions for how to pass variables to the query, I think sorting is not relevant for generate but it shouldnt cause problems.
.then(result => {
const { data } = result
const dynamicRoutes = data.Shops.by_category.edges.map(node => `/shops/${shop.slug}`)
console.log('dynamicRoutes: ')
console.log(dynamicRoutes)
return dynamicRoutes
})
here you need to return an array containing the routes you were expecting, you can add a console.log for debugging
from apollo.
will close this issue for now as it seems its been solved
from apollo.
Related Issues (20)
- $apollo and $apolloHelpers are unknown HOT 2
- How to use nuxtjs/apollo with apollo-upload-client HOT 1
- Nuxt can't start with apollo HOT 1
- Evict({}) not working HOT 1
- SSR renders template after useQuery is resolved HOT 2
- Type Inference breaks with `bundler` resolution HOT 2
- Support cache persistence configuration
- Apollo client not found HOT 2
- [useAsyncData] Component is already mounted, please use $fetch instead HOT 1
- Variables passed as ref are not passed along to apollo
- Can't access result.value after successful query on first load HOT 1
- Module '"@nuxtjs/apollo"' has no exported member 'defineApolloClient' HOT 1
- Relative API url doesn't work with SSR HOT 1
- _isomorphicFetch is not defined
- Multiple calls to `useAsyncQuery` from composable function causes 500 error in SSR HOT 2
- useQuery throws error if clientId supplied HOT 1
- fetchMore function missing in useAsyncQuery
- Failed to import useQuery HOT 1
- GraphQL playground on local server?
- Multiple clients aren't working
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from apollo.