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 theapp/
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
- :fire: remove icon.png https://github.com/vercel/next.js/issues/48603 — committed to Myoschen/portfolio by Myoschen a year ago
- Fix Windows path in route join (#48603) A change here: (#48202) 958150d Caused a URL to be joined with `path.join`, which on Windows inserts a backslash character. Changing to `path.posix.join` fixes... — committed to Preston-Landers/next.js by Preston-Landers a year ago
- Fix Windows path in route join (#48603) (#48779) A change here: (#48202) 958150d Caused a URL to be joined with `path.join`, which on Windows inserts a backslash character. Changing to `path.posix.jo... — committed to vercel/next.js by Preston-Landers a year ago
- fix: https://github.com/vercel/next.js/issues/48603 — committed to zhuanglong/nextjs-annex by deleted user a year ago
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 donpm run dev
).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 topath.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:
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 :
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