Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Nuxt 3 error : Directory import react-query core is not supported resolving ES modules

See original GitHub issue

Hello, I’m trying to migrate an app to Nuxt 3 and I’m encountering this error while running nuxt generate : I know the support is experimental at this stage, and I’m unsure if this is a Nuxt issue or a Vue query issue.

The pre-rendering server is doing something like this :

import * as core from 'react-query/core';

// core is then referenced many times like this :

function useQuery(arg1, arg2, arg3) {
	  return useBaseQuery(core.QueryObserver, arg1, arg2, arg3);

If I remove react-query from my dependencies, I get a different error

[nuxt] [request error] Cannot find package 'react-query' imported from

Here’s the full Error with react-query in the deps

[nuxt] [request error] Directory import 'website-nuxt/node_modules/react-query/core' is not supported resolving ES modules imported from website-nuxt/.nuxt/prerender/chunks/app/server.mjs
Did you mean to import react-query@3.38.0/node_modules/react-query/lib/core/index.js?
  at new NodeError (node:internal/errors:372:5)  
  at finalizeResolution (node:internal/modules/esm/resolve:401:17)  
  at moduleResolve (node:internal/modules/esm/resolve:964:10)  
  at defaultResolve (node:internal/modules/esm/resolve:1173:11)  
  at ESMLoader.resolve (node:internal/modules/esm/loader:604:30)  
  at ESMLoader.getModuleJob (node:internal/modules/esm/loader:318:18)  
  at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:80:40)  
  at link (node:internal/modules/esm/module_job:78:36)

Have you managed to make Nuxt (generate) and Vue-query work together ? (The app work fine when it’s in SSR or SPA mode)

Issue Analytics

  • State:closed
  • Created a year ago
  • Comments:6 (3 by maintainers)

github_iconTop GitHub Comments

DamianOsipiukcommented, Jun 8, 2022

v2.0.0-alpha.5 have update vue-demi version. It should now work without additional changes.

chris-vissercommented, Jun 20, 2022

Confirmed. Upgrading to alpha.5 fixed this issue for me

Read more comments on GitHub >

github_iconTop Results From Across the Web

'Directory import is not supported resolving ES modules' with ...
With ES6 modules you can not (yet?) import directories. Your import should look like this: import database from "./database/index.js".
Read more >
Directory import is not supported resolving ES modules #1201
We are running msw in a NextJS project using TypeScript and experience a similar error. Any feedback/help would be greatly appreciated, since it ......
Read more >
[nuxt] [request error] require is not defined in es module scope ...
Im trying to unse lighGallery inside a Vue Component with Nuxt 3 rc8 First i got a error that it is not possible...
Read more >
cannot find module [Node npm Error Solved] - freeCodeCamp
I'm getting the error because I'm trying to import the freeCodeCamp icon from the react-icons package, which I don't have installed.
Read more >
Discussion on: Nuxt 3 + Apollo Client - DEV Community ‍ ‍
`Directory import '.output\server\node_modules\@apollo\client\core' is not supported resolving ES modules imported.
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Post

No results found

github_iconTop Related Hashnode Post

No results found