Watchpack Error (initial scan): Error: ENOTDIR: not a directory in v3 #3322

hrougier · 2024-09-29T18:33:08Z

Describe the bug

Tried to use nextra 3.0.1 and got the following issue (reproduced in codesandbox).

To Reproduce

Go to codesandbox.io
Click on the Start Dev Server terminal
See error and broken UI

Watchpack Error (initial scan): Error: ENOTDIR: not a directory, scandir '/project/sandbox/node_modules/next/dist/pages/_app.js'
 ⚠ ./node_modules/@typescript/vfs/dist/vfs.esm.js
Critical dependency: the request of a dependency is an expression

Import trace for requested module:
./node_modules/@typescript/vfs/dist/vfs.esm.js
./node_modules/twoslash/dist/index.mjs
./node_modules/@shikijs/twoslash/dist/index.mjs
./node_modules/nextra/dist/server/compile.js
./node_modules/nextra/dist/client/components/playground.js
./node_modules/nextra/dist/client/components/index.js
./node_modules/nextra-theme-docs/dist/index.js

Expected behavior

No error in terminal and a working nextra site.

Additional context

Setup from the Getting Started tutorial with the following dependencies versions

{
  "next": "14.2.13",
  "nextra": "3.0.1",
  "nextra-theme-docs": "3.0.1",
  "react": "18.3.1",
  "react-dom": "18.3.1"
}

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

marcklingen · 2024-09-29T23:12:47Z

having the same issue, did you find a workaround to fix this?

hrougier · 2024-09-30T16:16:49Z

having the same issue, did you find a workaround to fix this?

Not yet, unlike the minimal codepen reproduction it doesn't work at all on my existing nextra site and only displays an Internal Server Error page instead of a broken UI, with the following stack traces:

 ○ Compiling / ...
Watchpack Error (initial scan): Error: ENOTDIR: not a directory, scandir '/path/to/node_modules/next/dist/pages/_app.js'
 ⨯ ../node_modules/typescript/lib/typescript.js:43173:24
Module not found: Can't resolve 'module'

https://nextjs.org/docs/messages/module-not-found

Import trace for requested module:
../node_modules/twoslash/dist/index.mjs
../node_modules/@shikijs/twoslash/dist/index.mjs
../node_modules/nextra/dist/server/compile.js
../node_modules/nextra/dist/client/components/playground.js
../node_modules/nextra/dist/client/components/index.js
../node_modules/nextra-theme-docs/dist/index.js
../node_modules/next/dist/esm/pages/_app.js

Watchpack Error (initial scan): Error: ENOTDIR: not a directory, scandir '/path/to/node_modules/next/dist/pages/_app.js'
 ⨯ ../node_modules/typescript/lib/typescript.js:43173:24
Module not found: Can't resolve 'module'

https://nextjs.org/docs/messages/module-not-found

Import trace for requested module:
../node_modules/twoslash/dist/index.mjs
../node_modules/@shikijs/twoslash/dist/index.mjs
../node_modules/nextra/dist/server/compile.js
../node_modules/nextra/dist/client/components/playground.js
../node_modules/nextra/dist/client/components/index.js
../node_modules/nextra-theme-docs/dist/index.js
../node_modules/next/dist/esm/pages/_app.js
 ⨯ Error: ENOENT: no such file or directory, open '/path/to/.next/fallback-build-manifest.json'
    at readFileSync (node:fs:448:20)
    at loadManifest (/path/to/node_modules/next/dist/server/load-manifest.js:36:52)
    at loadManifestWithRetries (/path/to/node_modules/next/dist/server/load-components.js:40:51)
    at async loadDefaultErrorComponentsImpl (/path/to/node_modules/next/dist/server/load-default-error-components.js:30:24)
    at async DevServer.getFallbackErrorComponents (/path/to/node_modules/next/dist/server/dev/next-dev-server.js:594:16)
    at async DevServer.renderErrorToResponseImpl (/path/to/node_modules/next/dist/server/base-server.js:2180:40)
    at async DevServer.renderToResponseImpl (/path/to/node_modules/next/dist/server/base-server.js:1996:30)
    at async DevServer.pipeImpl (/path/to/node_modules/next/dist/server/base-server.js:914:25)
    at async NextNodeServer.handleCatchallRenderRequest (/path/to/node_modules/next/dist/server/next-server.js:272:17)
    at async DevServer.handleRequestImpl (/path/to/node_modules/next/dist/server/base-server.js:810:17)
    at async /path/to/node_modules/next/dist/server/dev/next-dev-server.js:339:20
    at async Span.traceAsyncFn (/path/to/node_modules/next/dist/trace/trace.js:154:20)
    at async DevServer.handleRequest (/path/to/node_modules/next/dist/server/dev/next-dev-server.js:336:24)
    at async invokeRender (/path/to/node_modules/next/dist/server/lib/router-server.js:173:21)
    at async handleRequest (/path/to/node_modules/next/dist/server/lib/router-server.js:350:24) {
  errno: -2,
  code: 'ENOENT',
  syscall: 'open',
  path: '/path/to/.next/fallback-build-manifest.json'
}

nshiab · 2024-09-30T17:33:12Z

Same problem when I followed the steps here: https://nextra.site/docs/docs-theme/start

dimaMachina · 2024-09-30T20:01:23Z

try 3.0.2 where the warning Watchpack Error (initial scan): Error: ENOTDIR: not a directory, scandir is gone and styles seems correctly applied

marcklingen · 2024-09-30T20:02:33Z

Thanks for the quick fix @dimaMachina 🙏

did this resolve the issue for you @hrougier? I am still getting these errors on 3.0.2 (build and dev server):

./node_modules/.pnpm/@[email protected][email protected]/node_modules/@typescript/vfs/dist/vfs.esm.js
Critical dependency: the request of a dependency is an expression

Import trace for requested module:
./node_modules/.pnpm/@[email protected][email protected]/node_modules/@typescript/vfs/dist/vfs.esm.js
./node_modules/.pnpm/[email protected][email protected]/node_modules/twoslash/dist/index.mjs
./node_modules/.pnpm/@[email protected][email protected]/node_modules/@shikijs/twoslash/dist/index.mjs
./node_modules/.pnpm/[email protected]_@[email protected][email protected]_@[email protected][email protected]_react_kdvvi7vlst7dzlxuv6gvakrxwi/node_modules/nextra/dist/server/compile.js
./node_modules/.pnpm/[email protected]_@[email protected][email protected]_@[email protected][email protected]_react_kdvvi7vlst7dzlxuv6gvakrxwi/node_modules/nextra/dist/client/components/playground.js
./node_modules/.pnpm/[email protected]_@[email protected][email protected]_@[email protected][email protected]_react_kdvvi7vlst7dzlxuv6gvakrxwi/node_modules/nextra/dist/client/components/index.js

./node_modules/.pnpm/@[email protected][email protected]/node_modules/@typescript/vfs/dist/vfs.cjs.production.min.js
Critical dependency: the request of a dependency is an expression

Import trace for requested module:
./node_modules/.pnpm/@[email protected][email protected]/node_modules/@typescript/vfs/dist/vfs.cjs.production.min.js
./node_modules/.pnpm/@[email protected][email protected]/node_modules/@typescript/vfs/dist/index.js
./node_modules/.pnpm/[email protected][email protected]/node_modules/twoslash/dist/index.mjs
./node_modules/.pnpm/@[email protected][email protected]/node_modules/@shikijs/twoslash/dist/index.mjs
./node_modules/.pnpm/[email protected]_@[email protected][email protected]_@[email protected][email protected]_react_kdvvi7vlst7dzlxuv6gvakrxwi/node_modules/nextra/dist/server/compile.js
./node_modules/.pnpm/[email protected]_@[email protected][email protected]_@[email protected][email protected]_react_kdvvi7vlst7dzlxuv6gvakrxwi/node_modules/nextra/dist/client/components/playground.js
./node_modules/.pnpm/[email protected]_@[email protected][email protected]_@[email protected][email protected]_react_kdvvi7vlst7dzlxuv6gvakrxwi/node_modules/nextra/dist/client/components/index.js
./pages/blog/qa-chatbot-for-langfuse-docs.mdx

package.json

dimaMachina · 2024-09-30T20:11:42Z

this is upstream, false positive warnings from twoslash package https://nextra.site/docs/guide/advanced/twoslash-support

I reported it already microsoft/TypeScript-Website#3022

maybe we should disable twoslash by default

hrougier · 2024-09-30T20:24:14Z

@marcklingen Yes it did resolve the Watchpack warning but I still get these 2:

 ⨯ ../node_modules/typescript/lib/typescript.js:43173:24
Module not found: Can't resolve 'module'
... (see previous comment)

and

Error: ENOENT: no such file or directory, open '/path/to/.next/fallback-build-manifest.json'
... (see previous comment)

Still experimenting to see what might be causing these errors!

@dimaMachina I was about to ask you that, maybe it is possible to make twoslash optional through some configuration option?

marcklingen · 2024-09-30T20:51:28Z

maybe we should disable twoslash by default

Not sure if worth the complexity but would be a good option for me as I do not need twoslash support

Chirag-kalsariya · 2024-09-30T20:52:31Z

"dependencies": {
    "next": "^14.2.13",
    "nextra": "3.0.2",
    "nextra-theme-docs": "3.0.2",
    "react": "^18.3.1",
    "react-dom": "^18.3.1"
},
"devDependencies": {
    "@types/react": "^18.3.10",
    "@types/node": "22.7.4",
    "typescript": "^5.6.2"
}

I used 3.0.2, and still getting broken page with no css style. and Critical dependency error

○ Compiling / ...
 ⚠ ./node_modules/@typescript/vfs/dist/vfs.esm.js
Critical dependency: the request of a dependency is an expression

Import trace for requested module:
./node_modules/@typescript/vfs/dist/vfs.esm.js
./node_modules/twoslash/dist/index.mjs
./node_modules/@shikijs/twoslash/dist/index.mjs
./node_modules/nextra/dist/server/compile.js
./node_modules/nextra/dist/client/components/playground.js
./node_modules/nextra/dist/client/components/index.js
./node_modules/nextra-theme-docs/dist/index.js
 GET / 200 in 51967ms

hrougier · 2024-09-30T20:57:13Z

The error about the .next/fallback-build-manifest.json seems to happen because of the failing twoslash module import, I can confirm I got v3.0.2 to work by removing the following import and its usages:

import { rendererRich, transformerTwoslash } from "@shikijs/twoslash";

from node_modules/nextra/dist/server/compile.js (.next folder must be deleted and next dev server started again).

Now I have other issues with soft navigation when using the type: 'page' in _meta.js but that's another topic.

marcklingen · 2024-09-30T21:04:33Z

I used 3.0.2, and still getting broken page with no css style. and Critical dependency error

In my case this does not affect css, page works completely fine (we use nextra + tailwind), just breaks dev-server navigation (need to try to navigate to each page twice before it actually works) and produces these logs. Production deployment looks completely fine

Chirag-kalsariya · 2024-09-30T21:14:25Z

The error about the .next/fallback-build-manifest.json seems to happen because of the failing twoslash module import, I can confirm I got v3.0.2 to work by removing the following import and its usages:
import { rendererRich, transformerTwoslash } from "@shikijs/twoslash";
from node_modules/nextra/dist/server/compile.js (.next folder must be deleted and next dev server started again).

Now I have other issues with soft navigation when using the type: 'page' in _meta.js but that's another topic.

I try it, and work but In my case when directly go to http://localhost:3000 CSS is not working, but when I navigate pages everything is working fine. I am using npm not pnpm.

Chirag-kalsariya · 2024-09-30T21:19:58Z

I used 3.0.2, and still getting broken page with no css style. and Critical dependency error

In my case this does not affect css, page works completely fine, just breaks dev-server navigation (need to try to navigate to each page twice before it actually works) and produces these logs. Production deployment looks completely fine

Yes, Production deployment looks completely fine. with version 3.0.2. without changing anything in node_modules/nextra/dist/server/compile.js

dimaMachina · 2024-10-02T18:34:32Z

I found how to fix warnings from @typescript/vfs without waiting for upstream fix 🎉

#3330

dimaMachina · 2024-10-02T18:43:44Z

So now it left only warnings from unified

nextra:dev: "Value" is imported from external module "vfile" but never used in "node_modules/unified/index.d.ts".
nextra:dev: "CompileResults" is imported from external module "./lib/index.js" but never used in "node_modules/unified/index.d.ts".

Reported in unifiedjs/unified#250

hrougier added the bug Something isn't working label Sep 29, 2024

dimaMachina mentioned this issue Sep 30, 2024

remove warning Watchpack Error (initial scan): Error: ENOTDIR: not a directory, scandir 'path-to-your-node_modules/next/dist/pages/_app.js' #3328

Merged

dimaMachina closed this as completed in #3328 Sep 30, 2024

dimaMachina reopened this Sep 30, 2024

dimaMachina mentioned this issue Oct 2, 2024

remove Critical dependency: the request of a dependency is an expression warnings #3330

Merged

dimaMachina closed this as completed Oct 2, 2024

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Watchpack Error (initial scan): Error: ENOTDIR: not a directory in v3 #3322

Watchpack Error (initial scan): Error: ENOTDIR: not a directory in v3 #3322

hrougier commented Sep 29, 2024

marcklingen commented Sep 29, 2024

hrougier commented Sep 30, 2024

nshiab commented Sep 30, 2024

dimaMachina commented Sep 30, 2024

marcklingen commented Sep 30, 2024 •

edited

Loading

dimaMachina commented Sep 30, 2024

hrougier commented Sep 30, 2024 •

edited

Loading

marcklingen commented Sep 30, 2024

Chirag-kalsariya commented Sep 30, 2024

hrougier commented Sep 30, 2024

marcklingen commented Sep 30, 2024 •

edited

Loading

Chirag-kalsariya commented Sep 30, 2024

Chirag-kalsariya commented Sep 30, 2024

dimaMachina commented Oct 2, 2024 •

edited

Loading

dimaMachina commented Oct 2, 2024

Watchpack Error (initial scan): Error: ENOTDIR: not a directory in v3 #3322

Watchpack Error (initial scan): Error: ENOTDIR: not a directory in v3 #3322

Comments

hrougier commented Sep 29, 2024

marcklingen commented Sep 29, 2024

hrougier commented Sep 30, 2024

nshiab commented Sep 30, 2024

dimaMachina commented Sep 30, 2024

marcklingen commented Sep 30, 2024 • edited Loading

dimaMachina commented Sep 30, 2024

hrougier commented Sep 30, 2024 • edited Loading

marcklingen commented Sep 30, 2024

Chirag-kalsariya commented Sep 30, 2024

hrougier commented Sep 30, 2024

marcklingen commented Sep 30, 2024 • edited Loading

Chirag-kalsariya commented Sep 30, 2024

Chirag-kalsariya commented Sep 30, 2024

dimaMachina commented Oct 2, 2024 • edited Loading

dimaMachina commented Oct 2, 2024

marcklingen commented Sep 30, 2024 •

edited

Loading

hrougier commented Sep 30, 2024 •

edited

Loading

marcklingen commented Sep 30, 2024 •

edited

Loading

dimaMachina commented Oct 2, 2024 •

edited

Loading