TypeError: Cannot read properties of undefined (reading 'reduceRight')

[hawkeye64]

Describe the bug

Using @urql/vue, upgraded to v1.1.0 (dependency update only, no code changes) now gets the aforementioned error.

On this line

var composeExchanges = e => ({client: r, forward: t, dispatchDebug: n}) => e.reduceRight(((e, t) => {

in urql-core.mjs line: 489

I have a feeling @urql/vue v1x does not support the latest @urql/core v4x

Reproduction

https://codesandbox.io/p/sandbox/urql-vue-issue-rlrphn?file=%2Fsrc%2Fmain.js

Urql version

Found "@urql/core@4.0.4"

Validations

• I can confirm that this is a bug report, and not a feature request, RFC, question, or discussion, for which GitHub Discussions should be used
• Read the docs.
• Follow our Code of Conduct

[kitten]

Not a bug, so I'll convert this into a discussion shortly ✌️

You now have to explicitly pass an array of exchanges: #3114 (comment)

[boboldehampsink]

I have a feeling @urql/vue v1x does not support the latest @urql/core v4x

This... looks like a bug after all?

[barbalex]

I just updated this project from v3.0.4 to v4.0.0.
And since getting this error too:

The project is using urql.
Here is how the client is created: https://github.com/barbalex/vermehrung/blob/5441011946d4c82116fa975164dde21e0e7b21f0/src/utils/initiateApp.js

Seems like an error to me.

[barbalex]

Oh, I now found #3114. That is not an obvious place to find changes that need to be mande when updating. I propose adding this or a link to it to the release: https://github.com/urql-graphql/urql/releases/tag/urql%404.0.0.

Adding the exchanges works, so no error.

Thanks for this great tool.

Edit: I found the information here: https://github.com/urql-graphql/urql/releases/tag/%40urql%2Fcore%404.0.0
But that is not where I look for breaking changes when updating urql and knowing nothing of the inner structure of this library.

[kitten]

@barbalex There's not much we can do tbh to make the existence of the core library more obvious 😅 It's one of the only dependencies though and it updating is listed in the release notes. The release notes then also mention the breaking changes. And lastly, the migration guide is a pinned issue.

Also, when TypeScript isn't used we're aware that mistakes will happen, but adding invariants and checks for every API is unfortunately not realistic

So, all in all, there's an upper limit to how much we can put this on blast 😅 I'm not saying it's your bad, but I don't think there's much more we can do. When there's a breaking change, please check transitive dependencies as well though ✌️

In general, I'd always recommend to read at least which packages upgrades, transitive or not, after any update or upgrade, just to at least be aware of them

[MelodicCrypter]

Hello, can anyone tell how to avoid the this (temporary fix, etc), coz I'm also experiencing it using "@urql/svelte": "^4.0.0"

along with:

"@sveltejs/adapter-auto": "^2.0.0",
"@sveltejs/kit": "^1.15.5",
"graphql": "^16.6.0"

UPDATE:

• nah, my bad, I took at the latest documentation, it's just that there are changes, so now I need to use the "Client" and add exchanges:

if (data && data.locals.urqlOptions) {
  const client = new Client({
    ...data.locals.urqlOptions,
    exchanges: [cacheExchange, fetchExchange],
  });

  setContextClient(client);
}

It's working now.

[boboldehampsink]

Docs for using @urql/vue as a vue plugin are not updated, that's what's missing. Here is how it is supposed to work:

import urql, { cacheExchange, fetchExchange } from '@urql/vue';

const app = createApp(App)
  .use(urql, {
    url: import.meta.env.VITE_API_URL, // your API url
    exchanges: [cacheExchange, fetchExchange],
  });

[JoviDeCroock]

It's missing in one place, filed a pr