next.js: Next fails to build on Windows with a favicon.ico in the app/ folder (HookWebpackError: File C:\Users\xxx\Projects\next-favicon-reproduction\.next\server\app\favicon.ico\route.js does not exist.)

Verify canary release

  • I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
  Platform: win32
  Arch: x64
  Version: Windows 10 Pro
Binaries:
  Node: 18.16.0
  npm: N/A
  Yarn: N/A
  pnpm: 8.3.1
Relevant packages:
  next: 13.3.1-canary.16
  eslint-config-next: N/A
  react: 18.2.0
  react-dom: 18.2.0

Which area(s) of Next.js are affected? (leave empty if unsure)

App directory (appDir: true), Metadata (metadata, generateMetadata, next/head, head.js), Operating System (Windows, MacOS, Linux)

Link to the code that reproduces this issue

https://github.com/r3Fuze/next-favicon-reproduction

To Reproduce

  • Use Windows
  • Add a favicon.ico to the app/ folder. (I used one from create-next-app)
  • Run pnpm build
  • Build fails

Describe the Bug

This happens on Windows, but not when I tried to reproduce it on codesandbox.io.

It became a problem starting with 13.3.1-canary.6 and is still broken in 13.3.1-canary.16 Builds without problems on 13.3.1-canary.5

Full error:

warn  - You have enabled experimental feature (appDir) in next.config.js.
warn  - Experimental features are not covered by semver, and may cause unexpected or broken application behavior. Use at your own risk.
info  - Thank you for testing `appDir` please leave your feedback at https://nextjs.link/app-feedback

Failed to compile.

HookWebpackError: File C:\Users\xxx\Projects\next-favicon-reproduction\.next\server\app\favicon.ico\route.js does not exist.
    at makeWebpackError (C:\Users\xxx\Projects\next-favicon-reproduction\node_modules\.pnpm\next@13.3.1-canary.16_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\compiled\webpack\bundle5.js:28:308185)
    at C:\Users\xxx\Projects\next-favicon-reproduction\node_modules\.pnpm\next@13.3.1-canary.16_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\compiled\webpack\bundle5.js:28:105236
    at eval (eval at create (C:\Users\xxx\Projects\next-favicon-reproduction\node_modules\.pnpm\next@13.3.1-canary.16_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\compiled\webpack\bundle5.js:13:28771), <anonymous>:57:1)
    at C:\Users\xxx\Projects\next-favicon-reproduction\node_modules\.pnpm\next@13.3.1-canary.16_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\compiled\webpack\bundle5.js:28:68649
    at C:\Users\xxx\Projects\next-favicon-reproduction\node_modules\.pnpm\next@13.3.1-canary.16_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\build\webpack\plugins\next-trace-entrypoints-plugin.js:420:143
-- inner error --
Error: File C:\Users\xxx\Projects\next-favicon-reproduction\.next\server\app\favicon.ico\route.js does not exist.
    at Job.emitDependency (C:\Users\xxx\Projects\next-favicon-reproduction\node_modules\.pnpm\next@13.3.1-canary.16_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\compiled\@vercel\nft\index.js:1:39473)
    at async Promise.all (index 3)
    at async nodeFileTrace (C:\Users\xxx\Projects\next-favicon-reproduction\node_modules\.pnpm\next@13.3.1-canary.16_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\compiled\@vercel\nft\index.js:1:35430)
    at async C:\Users\xxx\Projects\next-favicon-reproduction\node_modules\.pnpm\next@13.3.1-canary.16_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\build\webpack\plugins\next-trace-entrypoints-plugin.js:141:28
    at async Span.traceAsyncFn (C:\Users\xxx\Projects\next-favicon-reproduction\node_modules\.pnpm\next@13.3.1-canary.16_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\trace\trace.js:97:20)
    at async TraceEntryPointsPlugin.createTraceAssets (C:\Users\xxx\Projects\next-favicon-reproduction\node_modules\.pnpm\next@13.3.1-canary.16_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\build\webpack\plugins\next-trace-entrypoints-plugin.js:95:9)
caused by plugins in Compilation.hooks.processAssets
Error: File C:\Users\xxx\Projects\next-favicon-reproduction\.next\server\app\favicon.ico\route.js does not exist.
    at Job.emitDependency (C:\Users\xxx\Projects\next-favicon-reproduction\node_modules\.pnpm\next@13.3.1-canary.16_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\compiled\@vercel\nft\index.js:1:39473)
    at async Promise.all (index 3)
    at async nodeFileTrace (C:\Users\xxx\Projects\next-favicon-reproduction\node_modules\.pnpm\next@13.3.1-canary.16_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\compiled\@vercel\nft\index.js:1:35430)
    at async C:\Users\xxx\Projects\next-favicon-reproduction\node_modules\.pnpm\next@13.3.1-canary.16_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\build\webpack\plugins\next-trace-entrypoints-plugin.js:141:28
    at async Span.traceAsyncFn (C:\Users\xxx\Projects\next-favicon-reproduction\node_modules\.pnpm\next@13.3.1-canary.16_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\trace\trace.js:97:20)
    at async TraceEntryPointsPlugin.createTraceAssets (C:\Users\xxx\Projects\next-favicon-reproduction\node_modules\.pnpm\next@13.3.1-canary.16_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\build\webpack\plugins\next-trace-entrypoints-plugin.js:95:9)


> Build failed because of webpack errors
info  - Creating an optimized production build . ELIFECYCLE  Command failed with exit code 1.```

### Expected Behavior

Next builds without errors

### Which browser are you using? (if relevant)

_No response_

### How are you deploying your application? (if relevant)

_No response_

About this issue

  • Original URL
  • State: closed
  • Created a year ago
  • Reactions: 16
  • Comments: 23 (3 by maintainers)

Commits related to this issue

Most upvoted comments

Just want to add, deleting favicon.ico from the app directory seems to fix the issue. The error pops back up if the favicon is restored.

I just moved the favicon.ico file to Public folder, and its working

I fixed it by deleting the .next folder and restarting the server (stop and do npm run dev).

https://github.com/vercel/next.js/blob/a92c5465cac0a123eee2a8086dbfff8482d811b8/packages/next/src/lib/metadata/get-metadata-route.ts#L57-L62

in these lines for icon.js and sitemap.js it generates :

\icon\[[...__metadata_id__]]\route
\sitemap.xml\route

When I put route = route.replace(/\\/g, "/"); at the end, everything works fine but I don’t really sure this is the fix. It may brake the mac env and maybe break a lot more. So I will silently fix this inside my node_modules and wait a PR from an author because I don’t fully know enough nextjs to create a PR

I can confirm that this fixes it.

I believe the problem can possibly be traced to this commit:

https://github.com/vercel/next.js/commit/958150d15be0bbd6a05fad99fc301461b8864734#diff-2a26488980bd59a2b7c91a1d463b2b61b2bba5bcdb68bc59fe24647eeed65666

The path.join is joining with backslash on Windows systems. Changing it to path.posix.join seems to fix the issue.

I tried removing favicon from app directory and it seems to fix the job, how favicon. Icon is supposed to have directory of route.js . This doesn’t make sense a lot of sense.

I have exactly the same error, and I’m using windows, do you think if I try to deploy it in vercel it should work?

Similar issue here but with a static robots.txt file. Works on 13.3.1-canary.5 but not with 13.3.1-canary.6 or later:

HookWebpackError: File C:\Users\User\Documents\Projects\project\.next\server\app\robots.txt\route.js does not exist.
    at makeWebpackError (C:\Users\User\Documents\Projects\project\node_modules\.pnpm\next@13.3.1_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\compiled\webpack\bundle5.js:28:308185)
    at C:\Users\User\Documents\Projects\project\node_modules\.pnpm\next@13.3.1_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\compiled\webpack\bundle5.js:28:105236
    at eval (eval at create (C:\Users\User\Documents\Projects\project\node_modules\.pnpm\next@13.3.1_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\compiled\webpack\bundle5.js:13:28771), <anonymous>:57:1)
    at C:\Users\User\Documents\Projects\project\node_modules\.pnpm\next@13.3.1_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\compiled\webpack\bundle5.js:28:68649
    at C:\Users\User\Documents\Projects\project\node_modules\.pnpm\next@13.3.1_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\build\webpack\plugins\next-trace-entrypoints-plugin.js:420:143
-- inner error --
Error: File C:\Users\User\Documents\Projects\project\.next\server\app\robots.txt\route.js does not exist.
    at Job.emitDependency (C:\Users\User\Documents\Projects\project\node_modules\.pnpm\next@13.3.1_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\compiled\@vercel\nft\index.js:1:39473)
    at async Promise.all (index 2)
    at async nodeFileTrace (C:\Users\User\Documents\Projects\project\node_modules\.pnpm\next@13.3.1_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\compiled\@vercel\nft\index.js:1:35430)
    at async C:\Users\User\Documents\Projects\project\node_modules\.pnpm\next@13.3.1_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\build\webpack\plugins\next-trace-entrypoints-plugin.js:141:28
    at async Span.traceAsyncFn (C:\Users\User\Documents\Projects\project\node_modules\.pnpm\next@13.3.1_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\trace\trace.js:97:20)
    at async TraceEntryPointsPlugin.createTraceAssets (C:\Users\User\Documents\Projects\project\node_modules\.pnpm\next@13.3.1_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\build\webpack\plugins\next-trace-entrypoints-plugin.js:95:9)       
caused by plugins in Compilation.hooks.processAssets
Error: File C:\Users\User\Documents\Projects\project\.next\server\app\robots.txt\route.js does not exist.
    at Job.emitDependency (C:\Users\User\Documents\Projects\project\node_modules\.pnpm\next@13.3.1_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\compiled\@vercel\nft\index.js:1:39473)
    at async Promise.all (index 2)
    at async nodeFileTrace (C:\Users\User\Documents\Projects\project\node_modules\.pnpm\next@13.3.1_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\compiled\@vercel\nft\index.js:1:35430)
    at async C:\Users\User\Documents\Projects\project\node_modules\.pnpm\next@13.3.1_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\build\webpack\plugins\next-trace-entrypoints-plugin.js:141:28
    at async Span.traceAsyncFn (C:\Users\User\Documents\Projects\project\node_modules\.pnpm\next@13.3.1_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\trace\trace.js:97:20)
    at async TraceEntryPointsPlugin.createTraceAssets (C:\Users\User\Documents\Projects\project\node_modules\.pnpm\next@13.3.1_react-dom@18.2.0_react@18.2.0\node_modules\next\dist\build\webpack\plugins\next-trace-entrypoints-plugin.js:95:9)       


> Build failed because of webpack errors

I also have this issue with Windows 11 and Next.js 13.3.1.

https://github.com/vercel/next.js/blob/a92c5465cac0a123eee2a8086dbfff8482d811b8/packages/next/src/lib/metadata/get-metadata-route.ts#L57-L62

in these lines for icon.js and sitemap.js it generates :

\icon\[[...__metadata_id__]]\route
\sitemap.xml\route

When I put route = route.replace(/\\/g, "/"); at the end, everything works fine but I don’t really sure this is the fix. It may brake the mac env and maybe break a lot more. So I will silently fix this inside my node_modules and wait a PR from an author because I don’t fully know enough nextjs to create a PR