Using peer dependencies instead of dependencies

[negezor]

I'm faced with the fact that I have different versions of dependencies in the project because of this module. It's also worth noting that I'm dependent on new versions of this module to update the dependencies.

I suggest using peer dependecies instead of direct dependencies. I also wrote a small module that replaces isomorphic-fetch because it has not been updated for a couple of years. Well and for convenience I added a file .editorconfig

I hope you accept this pull request, it solves the problem with updating modules 😊

[dohomi]

Hi @negezor thanks for your PR. I never really faced the problem of updates the module dependencies. If I'd change to peerDependency it will requires additional actions for the user - without that dependencies the module won't work at all thats why its inside the dependency section of package.json.

All projects I've seen so far (at apollo-client directly) are suggesting isomorphic-fetch as dependency - did you face any issues with it so far?

Beside that I'm open does anyone else have an opinion on this issue @Akryum @atinux

[negezor]

Yes indeed this will cause additional actions on the part of the user, but this will give more precise control of the dependencies. There are several reasons for this transition:

• Apollo modules are often updated and have fresh dependencies in many projects is critical.
• In the same vue-apollo, there are no direct dependencies on the apollo modules
• In addition to the standard apollo-link-http, libraries like apollo-upload-client that use external dependencies
• The package manager can install the modules in the local directory node_modules, which will lead to a version difference

As for isomorphic-fetch, it has not been updated for a couple of years already, pull request has not been accepted there for a long time. Again, it uses direct dependencies of modules that have long been obsolete and are not supported. I think that this is not a very good approach, or everyone is just waiting for an update to isomorphic-fetch.

[dohomi]

Ok thanks for your comments

[dohomi]

@negezor currently there is a wip PR open to extend and generalize apollo-module: #106
You might can chip in your ideas in that PR because that will leave everybody with an easier implementation and will follow best practices (based on the work of vue-cli-plugin-apollo)

[dohomi]

@negezor I published an entire new approach for the usage of apollo-module. Its available as 4.0.0-alpha.0

It would be great if you can check it out and see if it works for you as expected.

[negezor]

I have a conflict since how apollo-cache-inmemory should be created separately for both the client and the server. In my case, you need to transfer it introspectionQueryResultData. At the moment, a singleton object is created, which ultimately leads to the following:

 error TypeError: cache.transformDocument is not a function
  at QueryManager.fetchQuery (C:\Users\negezor\projects\shiza\node_modules\src\core\QueryManager.ts:300:25)
  at QueryManager.startQuery (C:\Users\negezor\projects\shiza\node_modules\src\core\QueryManager.ts:887:10)
  at ObservableQuery.setUpQuery (C:\Users\negezor\projects\shiza\node_modules\src\core\ObservableQuery.ts:577:23)
  at ObservableQuery.onSubscribe (C:\Users\negezor\projects\shiza\node_modules\src\core\ObservableQuery.ts:536:43)
  at C:\Users\negezor\projects\shiza\node_modules\src\core\ObservableQuery.ts:90:12
  at new Subscription (C:\Users\negezor\projects\shiza\node_modules\zen-observable\lib\Observable.js:179:34)
  at ObservableQuery.subscribe (C:\Users\negezor\projects\shiza\node_modules\zen-observable\lib\Observable.js:258:14)
  at C:\Users\negezor\projects\shiza\node_modules\src\core\ObservableQuery.ts:142:27
  at new Promise (C:\Users\negezor\projects\shiza\node_modules\core-js\modules\es6.promise.js:177:7)
  at ObservableQuery.result (C:\Users\negezor\projects\shiza\node_modules\src\core\ObservableQuery.ts:114:12)
  at C:\Users\negezor\projects\shiza\node_modules\src\core\QueryManager.ts:692:10
  at new Promise (C:\Users\negezor\projects\shiza\node_modules\core-js\modules\es6.promise.js:177:7)
  at QueryManager.query (C:\Users\negezor\projects\shiza\node_modules\src\core\QueryManager.ts:688:12)
  at ApolloClient.query (C:\Users\negezor\projects\shiza\node_modules\src\ApolloClient.ts:250:30)
  at C:\Users\negezor\projects\shiza\node_modules\vue-apollo\dist\vue-apollo.umd.js:1444:16
  at new Promise (C:\Users\negezor\projects\shiza\node_modules\core-js\modules\es6.promise.js:177:7)
  at ApolloProvider.prefetchQuery (C:\Users\negezor\projects\shiza\node_modules\vue-apollo\dist\vue-apollo.umd.js:1440:14)
  at C:\Users\negezor\projects\shiza\node_modules\vue-apollo\dist\vue-apollo.umd.js:1380:22
  at Array.map (<anonymous>)
  at ApolloProvider.prefetchAll (C:\Users\negezor\projects\shiza\node_modules\vue-apollo\dist\vue-apollo.umd.js:1379:47)
  at beforeNuxtRender (.nuxt/apollo-module:121:0)
  at promisify (.nuxt/utils.js:195:0)

// nuxt.config.js
const cacheInMemory = require('apollo-cache-inmemory');
const introspectionQueryResultData = require('./apollo/client-configs/fragmentTypes.json');

const fragmentMatcher = new cacheInMemory.IntrospectionFragmentMatcher({
	introspectionQueryResultData
});

const cache = new cacheInMemory.InMemoryCache({
	fragmentMatcher
});

module.exports = {
	// ...
	apollo: {
		clientConfigs: {
			// default: '@/apollo/client-configs/default.mjs'
			default: {
				httpEndpoint: 'http://127.0.0.1:3000/graphql',
				tokenName: 'accessToken',
				cache
			}
		}
	}
};

I think it should be possible to wrap the config into an anonymous function:

module.exports = {
	// ...
	apollo: {
		clientConfigs: {
			// default: '@/apollo/client-configs/default.mjs'
			default(context) {
				const fragmentMatcher = new cacheInMemory.IntrospectionFragmentMatcher({
					introspectionQueryResultData
				});

				const cache = new cacheInMemory.InMemoryCache({
					fragmentMatcher
				});

				return {
					httpEndpoint: `${context.env.baseUrl}/graphql`,
					tokenName: 'accessToken',
					cache
				};
 }
		}
	}
};

[dohomi]

@negezor I never faced that issue. Can you adjust or wire up a new PR to make the current master comply with your setup?

[dohomi]

one thought about it:

as you can provide your own cache function, can't you do:

apollo:{
  clientConfigs:{
    default:{
      httpEndpoint: YOUR_ENDPOINT,
      cache: () => {
         if(process.server) {
           // logic for server cache
           return SERVER_CACHE
         }
         // logic for client cache
         return CLIENT_CACHE
      }
   }
}

[negezor]

Yes, I also think that it will be better that way. But you need to fix this in vue-cli-plugin-apollo.
I'm confused in plugin.js that here there is a check on the function after the object has completely led to JSON

const currentOptions = <%= JSON.stringify(options.clientConfigs[key], null, 2) %>
// ...
const getAuth = typeof currentOptions.getAuth === 'function' ? currentOptions.getAuth : () => {