nuxt-modules
custom link doesn't work when declared in apollo.config.js
Version
Reproduction link
https://codesandbox.io/s/romantic-volhard-oz2dd?fontsize=14&hidenavigation=1&theme=dark
Steps to reproduce
Run repro. See error.
What is expected ?
link to be loaded as apollo link
What is actually happening?
type error: x.concat is not a function
Additional comments?
After much consternation, I've tracked this down to this part of templates/plugin.js.
Essentially, if you provide a clientConfig as an object within nuxt.config.js, then it will be JSON.stringified. ApolloLink.prototype.toString() returns {}, so after stringification & parsing you get a plain empty object. Later when this is passed to ApolloLink.from, it will try to the link's concat method which doesn't exist because it's just a plain object.
In your nuxt.config.js if you define clientConfigs as a reference to another file like:
clientConfigs: {
default: '~/plugins/apollo/apollo.default.js'
}
it will work as expected, because the config doesn't get stringified.
I just noticed that this is kind of covered in the readme, surprised I didn't noticed when I was beating my head against it before!
Maybe throw an error if any of the config values in nuxt.config.js are functions ?
I weird because I believe this it's already being handled https://github.com/nuxt-community/apollo-module/blob/70fb62864764a72c5f11d23ea4c9ce99d0f9fa57/lib/module.js#L14-L29
Hmm... that just checks whether the configuration is an object or a string, something like this would pass this check but fail being stringified, because the config is an object, but contains a property with a value which can't be stringified:
{
apollo: {
clientConfigs: {
default: {
link: () => { ... }
}
}
}
}
The only solutions I can think of involve either flattening the config object and testing all the values, or using a replacer in JSON.stringify() something like this:
JSON.stringify(clientConfig, (_, value) => {
// check for unstringifyables here
if (...) throw new Error('...')
return value
})
@leviwheatcroft as I understood from docs you have to set defaultHttpLink: false when using custom link. https://github.com/Akryum/vue-cli-plugin-apollo/blob/master/graphql-client/src/index.js#L34
but then I have other error:
Cannot read property 'length' of undefined
}
return LinkError;
}(Error));
exports.LinkError = LinkError;
function isTerminating(link) {
return link.request.length <= 1; // here is error
}
exports.isTerminating = isTerminating;
function toPromise(observable) {
var completed = false;
return new Promise(function (resolve, reject) {
I am having same issue with @gibkigonzo that says: Cannot read property 'length' of undefined
Any solutions yet..?
