Can't import the named export 'makeFetchBody' from non EcmaScript module (only default export is available) #732

BjoernRave · 2020-04-21T17:07:38Z

It's me again with a new error

[ error ] ./node_modules/@urql/exchange-multipart-fetch/dist/urql-exchange-multipart-fetch.mjs
[1] Can't import the named export 'makeFetchBody' from non EcmaScript module (only default export is available)
[1] Could not find files for /en/movement/new in .next/build-manifest.json
[1] Could not find files for /en/movement/new in .next/build-manifest.json
[1] ModuleDependencyError: Can't import the named export 'makeFetchBody' from non EcmaScript module (only default export is available)

Versions:
"urql": "1.9.7",
"@urql/exchange-graphcache": "2.3.5",
"@urql/exchange-multipart-fetch": "0.1.5",

(Did a reinstall after the new release of @urql/core)

The text was updated successfully, but these errors were encountered:

JoviDeCroock · 2020-04-21T17:53:28Z

Hey, sorry for the trouble. Would you mind trying it with

"@urql/core": "https://pkg.csb.dev/FormidableLabs/urql/commit/0ebb2f04/@urql/core"

BjoernRave · 2020-04-21T18:00:28Z

I tried it and I think it's the same error, I copied the whole error log this time:

[ error ] ./node_modules/@urql/exchange-multipart-fetch/dist/urql-exchange-multipart-fetch.mjs
[1] Can't import the named export 'makeFetchBody' from non EcmaScript module (only default export is available)
[1] Could not find files for /movement in .next/build-manifest.json
[1] ModuleDependencyError: Can't import the named export 'makeFetchBody' from non EcmaScript module (only default export is available)
[1]     at Compilation.reportDependencyErrorsAndWarnings (/Users/bjoern/projects/inventhora/frontend/node_modules/webpack/lib/Compilation.js:1468:21)
[1]     at /Users/bjoern/projects/inventhora/frontend/node_modules/webpack/lib/Compilation.js:1258:10
[1]     at AsyncSeriesHook.eval [as callAsync] (eval at create (/Users/bjoern/projects/inventhora/frontend/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
[1]     at AsyncSeriesHook.lazyCompileHook (/Users/bjoern/projects/inventhora/frontend/node_modules/tapable/lib/Hook.js:154:20)
[1]     at Compilation.finish (/Users/bjoern/projects/inventhora/frontend/node_modules/webpack/lib/Compilation.js:1253:28)
[1]     at /Users/bjoern/projects/inventhora/frontend/node_modules/webpack/lib/Compiler.js:672:17
[1]     at _done (eval at create (/Users/bjoern/projects/inventhora/frontend/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:9:1)
[1]     at eval (eval at create (/Users/bjoern/projects/inventhora/frontend/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:31:22)
[1]     at runMicrotasks (<anonymous>)
[1]     at processTicksAndRejections (internal/process/task_queues.js:94:5)
[1] ModuleDependencyError: Can't import the named export 'makeFetchBody' from non EcmaScript module (only default export is available)
[1]     at Compilation.reportDependencyErrorsAndWarnings (/Users/bjoern/projects/inventhora/frontend/node_modules/webpack/lib/Compilation.js:1468:21)
[1]     at /Users/bjoern/projects/inventhora/frontend/node_modules/webpack/lib/Compilation.js:1258:10
[1]     at AsyncSeriesHook.eval [as callAsync] (eval at create (/Users/bjoern/projects/inventhora/frontend/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
[1]     at AsyncSeriesHook.lazyCompileHook (/Users/bjoern/projects/inventhora/frontend/node_modules/tapable/lib/Hook.js:154:20)
[1]     at Compilation.finish (/Users/bjoern/projects/inventhora/frontend/node_modules/webpack/lib/Compilation.js:1253:28)
[1]     at /Users/bjoern/projects/inventhora/frontend/node_modules/webpack/lib/Compiler.js:672:17
[1]     at _done (eval at create (/Users/bjoern/projects/inventhora/frontend/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:9:1)
[1]     at eval (eval at create (/Users/bjoern/projects/inventhora/frontend/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:31:22)
[1]     at runMicrotasks (<anonymous>)
[1]     at processTicksAndRejections (internal/process/task_queues.js:94:5)

tonyhb · 2020-04-21T20:10:30Z

When using with react the docs say to install via:

yarn add urql graphql

This means we don't have @urql/core in our package.json. I've replaced urql with the commit:

  2   "name": "ui",
  3   "version": "0.1.0",
  4   "private": true,
  5   "dependencies": {
...
 16     "@urql/exchange-multipart-fetch": "^0.1.5",
...
 26     "react-use-form-state": "^0.11.0",
 27     "typescript": "^3.6.4",
 28     "urql": "https://pkg.csb.dev/FormidableLabs/urql/commit/0ebb2f04/@urql/core"
 29   },

But we then can't import Provider from urql:

  Provider as UrqlProvider,
  createClient,
  dedupExchange,
  cacheExchange,
} from "urql";

Gives this error:

Attempted import error: 'Provider' is not exported from 'urql' (imported as 'UrqlProvider').

Could we roll a new release with the fix? :)

JoviDeCroock · 2020-04-21T20:15:34Z

It's expected that it won't work when you use urql/core as urql adding a dep can pin it to a certain version.

So adding @urql/core: "version x" can pin it for you.

tonyhb · 2020-04-21T20:28:55Z

Right, but adding just that doesn't fix the problem. With this, as you say:

    "urql": "^1.9.7",
    "@urql/core": "https://pkg.csb.dev/FormidableLabs/urql/commit/0ebb2f04/@urql/core",
    "@urql/exchange-multipart-fetch": "^0.1.5",

We get the error:

Can't import the named export 'makeFetchBody' from non EcmaScript module (only default export is available)

With this:

    "urql": "https://pkg.csb.dev/FormidableLabs/urql/commit/0ebb2f04/@urql/core",
    "@urql/core": "https://pkg.csb.dev/FormidableLabs/urql/commit/0ebb2f04/@urql/core",
    "@urql/exchange-multipart-fetch": "^0.1.5",

We get the error:

Attempted import error: 'Provider' is not exported from 'urql'.

So, given adding that line doesn't work – what do we do?

Edit: And with a third...

    "urql": "https://pkg.csb.dev/FormidableLabs/urql/commit/0ebb2f04/urql",
    "@urql/core": "https://pkg.csb.dev/FormidableLabs/urql/commit/0ebb2f04/@urql/core",
    "@urql/exchange-multipart-fetch": "^0.1.5",

We get the same error – no fix:

Can't import the named export 'makeFetchBody' from non EcmaScript module (only default export is available)

JoviDeCroock · 2020-04-21T20:35:11Z

Yes so "urql": "https://pkg.csb.dev/FormidableLabs/urql/commit/0ebb2f04/urql", as I said this is using @urql/core as the data for urql

tonyhb · 2020-04-21T20:36:49Z

I tried two things in the above post. Looking at the first:

    "urql": "^1.9.7",
    "@urql/core": "https://pkg.csb.dev/FormidableLabs/urql/commit/0ebb2f04/@urql/core",
    "@urql/exchange-multipart-fetch": "^0.1.5",

It gives us the same error. I'm a little confused at what else you're proposing as the fix here?

kitten · 2020-04-21T20:37:51Z

To quickly chime in here, I believe the CodeSandbox CI package for 0ebb2f0 is broken; this one is a newer one: https://pkg.csb.dev/FormidableLabs/urql/commit/73d2f3f8/urql and https://pkg.csb.dev/FormidableLabs/urql/commit/73d2f3f8/@urql/core

kitten · 2020-04-21T20:57:16Z

Can you have a look at running @urql/[email protected] please? That should fix this issue. yarn upgrade @urql/core should do the trick.

tonyhb · 2020-04-21T21:02:46Z

Unfortunately fails. Believe it's not the core package, it's specifically "@urql/exchange-multipart-fetch": "^0.1.5",.

Here's my package.json:

"@urql/core": "1.11.3",
"@urql/exchange-multipart-fetch": "^0.1.5",
"urql": "^1.9.7"

Also tried using require...

const { multipartFetchExchange } = require('@urql/exchange-multipart-fetch')

Using create-react-app w/ typescript. I guess I'll rewire webpack's config.

Edit: I'll use XHR to upload files. As a bonus I can listen to onprogress :)

kitten · 2020-04-21T21:09:38Z

Ok, I’ll investigate this further. In my quick test in Next, I can’t reproduce this anymore however. So if it’s no old version of @urql/core are showing up for you with yarn list --pattern urql` then it’s still an issue and I’ll take another look tomorrow-ish 🤞

tonyhb · 2020-04-21T21:12:50Z

 ❯ yarn list --pattern urql                                                                               [17:11:52]
yarn list v1.21.1
├─ @urql/[email protected]
├─ @urql/[email protected]
└─ [email protected]
Done in 0.82s.

Still seeing it, but it's no bother. Quickly wanted to say that this is a really, really, really awesome library, so thank you all for your work!!!

JoviDeCroock · 2020-04-21T21:14:24Z

Seems to work in the codesandbox CRA, this is odd https://codesandbox.io/s/flamboyant-moon-0kh6h?file=/src/App.js

tonyhb · 2020-04-21T21:15:39Z

Super weird. Will try reinstalling everything and upgrading any global packages I have to see if it fixes. Sounds like it's something local. Appreciate it.

BjoernRave · 2020-04-21T22:22:29Z

okay so I tried again with @urql/[email protected] being installed and I still get the same error.

I am using Next.js as you could probably already deduct from my error log

kitten · 2020-04-21T22:26:17Z

Sorry about this! I finally found what caused our broken builds and #734 fixed it. That's released as @urql/[email protected] and @urql/[email protected]. The broken releases have been marked as deprecated (or deleted where possible) on npm.

OriginalEXE · 2020-04-21T22:51:15Z

@BjoernRave Are you using next-urql by any chance?

I am running next-urql powered by ts-node and I still get the following error, even on 1.11.4:

Error: No valid exports main found for '/Users/ante/Projects/MarkerHero-Website/node_modules/@urql/core'
    at resolveExportsTarget (internal/modules/cjs/loader.js:611:9)
    at applyExports (internal/modules/cjs/loader.js:492:14)
    at resolveExports (internal/modules/cjs/loader.js:541:12)
    at Function.Module._findPath (internal/modules/cjs/loader.js:643:22)
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:941:27)
    at Function.Module._load (internal/modules/cjs/loader.js:847:27)
    at Module.require (internal/modules/cjs/loader.js:1016:19)
    at require (internal/modules/cjs/helpers.js:69:18)
    at Object.<anonymous> (/Users/ante/Projects/MarkerHero-Website/node_modules/urql/dist/urql.js:1:12)
    at Module._compile (internal/modules/cjs/loader.js:1121:30)
    at Module._extensions..js (internal/modules/cjs/loader.js:1160:10)
    at Object.require.extensions.<computed> [as .js] (/Users/ante/Projects/MarkerHero-Website/node_modules/ts-node/src/index.ts:832:44)
    at Module.load (internal/modules/cjs/loader.js:976:32)
    at Function.Module._load (internal/modules/cjs/loader.js:884:14)
    at Module.require (internal/modules/cjs/loader.js:1016:19)
    at require (internal/modules/cjs/helpers.js:69:18) {
  code: 'MODULE_NOT_FOUND'
}

kitten · 2020-04-21T23:58:07Z

Oh, I didn’t realise you were running ts-node. I was able to replicate this bug for @urql/core/internal in prior versions with Next.js, but @urql/core should always work as usual.

Could it be that it’s specific to ts-node?

BjoernRave · 2020-04-22T10:58:54Z

I can confirm, that everythings works now for me.

The error from @OriginalEXE seems to be different that what I was facing

JoviDeCroock · 2020-04-22T11:00:48Z

ts-node might have issues with "guessing" extensions which is a measure we had to call-to-live so we could support both Node 13 and Webpack

OriginalEXE · 2020-04-22T11:08:44Z

The weird thing is that I tried to manually specify the extension, but that did not help.

I will try to create a minimal reproduction, and will open a separate ticket.

dkozma · 2020-06-07T11:31:09Z

FYI, I kept getting the same issue as @BjoernRave, and not even the upgrade to @urql/[email protected] and @urql/[email protected] resolved it for me.

However, adding the following to my webpack config seemed to fix the issue:

module: {
  rules: [
    {
      test: /\.mjs$/,
      include: /node_modules/,
      type: 'javascript/auto'
    }
  ]
}

BjoernRave added the bug 🐛 Oh no! A bug or unintented behaviour. label Apr 21, 2020

JoviDeCroock mentioned this issue Apr 21, 2020

(fix) - Fix internal and graphcache/extras main path #733

Merged

kitten closed this as completed in #733 Apr 21, 2020

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Can't import the named export 'makeFetchBody' from non EcmaScript module (only default export is available) #732

Can't import the named export 'makeFetchBody' from non EcmaScript module (only default export is available) #732

BjoernRave commented Apr 21, 2020 •

edited

Loading

JoviDeCroock commented Apr 21, 2020

BjoernRave commented Apr 21, 2020

tonyhb commented Apr 21, 2020 •

edited

Loading

JoviDeCroock commented Apr 21, 2020 •

edited

Loading

tonyhb commented Apr 21, 2020 •

edited

Loading

JoviDeCroock commented Apr 21, 2020 •

edited by kitten

Loading

tonyhb commented Apr 21, 2020

kitten commented Apr 21, 2020

kitten commented Apr 21, 2020

tonyhb commented Apr 21, 2020 •

edited

Loading

kitten commented Apr 21, 2020

tonyhb commented Apr 21, 2020

JoviDeCroock commented Apr 21, 2020

tonyhb commented Apr 21, 2020 •

edited

Loading

BjoernRave commented Apr 21, 2020

kitten commented Apr 21, 2020

OriginalEXE commented Apr 21, 2020

kitten commented Apr 21, 2020

BjoernRave commented Apr 22, 2020

JoviDeCroock commented Apr 22, 2020

OriginalEXE commented Apr 22, 2020

dkozma commented Jun 7, 2020

Can't import the named export 'makeFetchBody' from non EcmaScript module (only default export is available) #732

Can't import the named export 'makeFetchBody' from non EcmaScript module (only default export is available) #732

Comments

BjoernRave commented Apr 21, 2020 • edited Loading

JoviDeCroock commented Apr 21, 2020

BjoernRave commented Apr 21, 2020

tonyhb commented Apr 21, 2020 • edited Loading

JoviDeCroock commented Apr 21, 2020 • edited Loading

tonyhb commented Apr 21, 2020 • edited Loading

JoviDeCroock commented Apr 21, 2020 • edited by kitten Loading

tonyhb commented Apr 21, 2020

kitten commented Apr 21, 2020

kitten commented Apr 21, 2020

tonyhb commented Apr 21, 2020 • edited Loading

kitten commented Apr 21, 2020

tonyhb commented Apr 21, 2020

JoviDeCroock commented Apr 21, 2020

tonyhb commented Apr 21, 2020 • edited Loading

BjoernRave commented Apr 21, 2020

kitten commented Apr 21, 2020

OriginalEXE commented Apr 21, 2020

kitten commented Apr 21, 2020

BjoernRave commented Apr 22, 2020

JoviDeCroock commented Apr 22, 2020

OriginalEXE commented Apr 22, 2020

dkozma commented Jun 7, 2020

BjoernRave commented Apr 21, 2020 •

edited

Loading

tonyhb commented Apr 21, 2020 •

edited

Loading

JoviDeCroock commented Apr 21, 2020 •

edited

Loading

tonyhb commented Apr 21, 2020 •

edited

Loading

JoviDeCroock commented Apr 21, 2020 •

edited by kitten

Loading

tonyhb commented Apr 21, 2020 •

edited

Loading

tonyhb commented Apr 21, 2020 •

edited

Loading