nextjs - ✅(Solved) Fix Custom image loader does not work on Windows [1 pull requests, 4 comments, 5 participants]

Official PRs (…)
ON THIS PAGE

Recommended Tools

×6

Utilities matched from this issue’s tags and category — try them while you read without losing context.

GitHub issue graph ai analysis

Paste a GitHub issue URL. We fetch that issue, discover linked issues from bodies/comments/timeline, collect linked pull requests, and produce a structured English report.

The report is written in English Markdown for sharing and archival.

Helpful · Quick feedback

Loading…
GitHub stats
vercel/next.js#86614Fetched 2026-04-08 02:10:05
View on GitHub
Comments
4
Participants
5
Timeline
12
Reactions
5
Timeline (top)
commented ×4labeled ×2referenced ×2closed ×1

Error Message

\next-windows-image-loader-bug.next\dev\server\chunks\ssr\node_modules_e6f2a25f._.js: Invalid source map. Only conformant source maps can be used to find the original code. Cause: Error: sourceMapURL could not be parsed ⨯ Error: Image with src "https://example.com/someimage.jpg" is missing "loader" prop. Read more: https://nextjs.org/docs/messages/next-image-missing-loader at ignore-listed frames { digest: '2389313161' }

Fix Action

Fixed

PR fix notes

PR #6: Normalize image loaderFile path for Windows compatibility

Description (problem / solution / changelog)

What?

This PR normalizes the loaderFile path used in image configuration for Windows compatibility. It replaces backslashes with forward slashes, fixes absolute path duplication issues, and includes an integration test specifically for Windows environments.

Why?

To ensure consistent functionality across platforms, especially on Windows, where backslashes in paths can cause issues. This change resolves a reported problem and ensures robust path handling in the application.

How?

  • Updated create-compiler-aliases.ts to normalize the loaderFile path.
  • Adjusted the logic in config.ts to prevent path duplication issues.
  • Added an integration test to cover Windows-specific behavior.

Fixes #86614


## Changed files

- `packages/next/src/build/create-compiler-aliases.ts` (modified, +7/-2)
- `packages/next/src/server/config.ts` (modified, +3/-1)
- `test/integration/next-image-new/loader-config-windows/dummy-loader.js` (added, +3/-0)
- `test/integration/next-image-new/loader-config-windows/next.config.js` (added, +8/-0)
- `test/integration/next-image-new/loader-config-windows/pages/get-img-props.js` (added, +34/-0)
- `test/integration/next-image-new/loader-config-windows/pages/index.js` (added, +35/-0)
- `test/integration/next-image-new/loader-config-windows/public/logo.png` (added, +0/-0)
- `test/integration/next-image-new/loader-config-windows/test/index.test.ts` (added, +89/-0)

Code Example

\next-windows-image-loader-bug\.next\dev\server\chunks\ssr\node_modules_e6f2a25f._.js: Invalid source map. Only conformant source maps can be used to find the original code. Cause: Error: sourceMapURL could not be parsed
Error: Image with src "https://example.com/someimage.jpg" is missing "loader" prop.
Read more: https://nextjs.org/docs/messages/next-image-missing-loader
    at ignore-listed frames {
  digest: '2389313161'
}

---

Operating System:
  Platform: win32
  Arch: x64
  Version: Windows 11 Pro
  Available memory (MB): 65014
  Available CPU cores: 14
Binaries:
  Node: 24.11.1
  npm: 11.6.2
  Yarn: N/A
  pnpm: N/A
Relevant Packages:
  next: 16.0.5 // Latest available version is detected (16.0.5).
  eslint-config-next: N/A
  react: 19.2.0
  react-dom: 19.2.0
  typescript: 5.9.3
Next.js Config:
  output: N/A
RAW_BUFFERClick to expand / collapse

Link to the code that reproduces this issue

https://github.com/damianfrizzi/next-windows-image-loader-bug

To Reproduce

  1. bun install
  2. bun run dev
  3. Page crashes with error on Windows

Current vs. Expected behavior

The globally defined custom image loader works on MacOS but not on Windows. On Windows the following error appears:

\next-windows-image-loader-bug\.next\dev\server\chunks\ssr\node_modules_e6f2a25f._.js: Invalid source map. Only conformant source maps can be used to find the original code. Cause: Error: sourceMapURL could not be parsed
 ⨯ Error: Image with src "https://example.com/someimage.jpg" is missing "loader" prop.
Read more: https://nextjs.org/docs/messages/next-image-missing-loader
    at ignore-listed frames {
  digest: '2389313161'
}

Provide environment information

Operating System:
  Platform: win32
  Arch: x64
  Version: Windows 11 Pro
  Available memory (MB): 65014
  Available CPU cores: 14
Binaries:
  Node: 24.11.1
  npm: 11.6.2
  Yarn: N/A
  pnpm: N/A
Relevant Packages:
  next: 16.0.5 // Latest available version is detected (16.0.5).
  eslint-config-next: N/A
  react: 19.2.0
  react-dom: 19.2.0
  typescript: 5.9.3
Next.js Config:
  output: N/A

Which area(s) are affected? (Select all that apply)

Image (next/image)

Which stage(s) are affected? (Select all that apply)

next dev (local)

Additional context

No response

extent analysis

TL;DR

The issue can be resolved by ensuring the custom image loader is properly configured for Windows, potentially by adjusting the next.config.js file to handle Windows-specific paths or configurations.

Guidance

  • Review the next.config.js file to ensure the custom image loader is correctly defined and exported, considering potential differences in path handling between MacOS and Windows.
  • Verify that the loader prop is correctly set for the image component, as indicated by the error message, and that this prop is compatible with the custom image loader on Windows.
  • Check the Next.js documentation for any platform-specific recommendations or configurations for custom image loaders, especially regarding source maps and error handling.
  • Consider testing the custom image loader with a simple image src to isolate if the issue is with the loader itself or the specific image being loaded.

Example

No specific code example can be provided without modifying the original codebase, but ensuring the next.config.js has a correct module export for the custom image loader, such as:

module.exports = {
  //... other configurations
  images: {
    loader: 'custom',
    // Ensure paths and configurations are correctly set for Windows
  },
}

might be a starting point for investigation.

Notes

The exact fix depends on the specifics of the custom image loader implementation and how it interacts with Windows paths and configurations, which are not fully detailed in the provided issue.

Recommendation

Apply workaround: Adjust the next.config.js to properly handle Windows configurations, as the issue seems related to platform-specific differences in handling custom image loaders.

Vote matrix · Quick signals

Works
Did the solution work? Tap to confirm.
Easy Fix
Was it a quick fix?
Time Saver
Did it save you time?
Blocking
Was it severely blocking?
Common Issue
Are others likely hitting this too?
Flaky / Intermittent
Is it intermittent?
Verified / Reproducible
Can you reproduce it reliably?
Loading…

Still need to ship something?

×6

Another batch ranked right after the header list — different links, same matching logic.

Back to top recommendations

TRENDING