nextjs - ✅(Solved) Fix NextJS 16 version of turbopack failing to resolve bootstrap imports on Windows [2 pull requests, 6 comments, 6 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#86431Fetched 2026-04-08 02:11:05
View on GitHub
Comments
6
Participants
6
Timeline
30
Reactions
5
Author
Timeline (top)
subscribed ×15commented ×6cross-referenced ×5referenced ×2

Error Message

Build error occurred Error: Turbopack build failed with 1 errors: Error evaluating Node.js code Error: Can't find stylesheet to import. Caused by: Error: Can't find stylesheet to import. Exports made by CommonJs syntax will lead to a runtime error, since the module is in EcmaScript mode. Either change the "type" field in the package.json or replace CommonJs syntax with EcmaScript import/export syntax in the source file.

Root Cause

Build error occurred Error: Turbopack build failed with 1 errors: ./src/styles/my-bootstrap.scss Error evaluating Node.js code Error: Can't find stylesheet to import. ╷ 1753 │ @import "variables-dark"; // TODO: can be removed safely in v6, only here to avoid breaking changes in v5.3 │ ^^^^^^^^^^^^^^^^ ╵ node_modules\bootstrap\scss_variables.scss 1753:9 @import src\styles\my-bootstrap.scss 5:9 root stylesheet Caused by: Error: Can't find stylesheet to import. ╷ 1753 │ @import "variables-dark"; // TODO: can be removed safely in v6, only here to avoid breaking changes in v5.3 │ ^^^^^^^^^^^^^^^^ ╵ node_modules\bootstrap\scss_variables.scss 1753:9 @import src\styles\my-bootstrap.scss 5:9 root stylesheet [at Object.wrapException (C:\Users\admin\Desktop\proj\node_modules\sass\sass.dart.js:2316:47)] [at C:\Users\admin\Desktop\proj\node_modules\sass\sass.dart.js:88031:25] [at _wrapJsFunctionForAsync_closure.$protected (C:\Users\admin\Desktop\proj\node_modules\sass\sass.dart.js:4984:15)] [at _wrapJsFunctionForAsync_closure.call$2 (C:\Users\admin\Desktop\proj\node_modules\sass\sass.dart.js:38319:12)] [at _awaitOnObject_closure.call$1 (C:\Users\admin\Desktop\proj\node_modules\sass\sass.dart.js:38307:32)] [at Object._rootRunUnary (C:\Users\admin\Desktop\proj\node_modules\sass\sass.dart.js:5402:18)] [at StaticClosure.<anonymous> (C:\Users\admin\Desktop\proj\node_modules\sass\sass.dart.js:125885:16)] [at _CustomZone.runUnary$2$2 (C:\Users\admin\Desktop\proj\node_modules\sass\sass.dart.js:39750:39)] [at _Future__propagateToListeners_handleValueCallback.call$0 (C:\Users\admin\Desktop\proj\node_modules\sass\sass.dart.js:38808:51)] [at Object._Future__propagateToListeners (C:\Users\admin\Desktop\proj\node_modules\sass\sass.dart.js:5194:93)]

Fix Action

Fixed

PR fix notes

PR #9: Resolve SCSS imports on Windows using Turbopack.

Description (problem / solution / changelog)

What?

This pull request resolves issues with SCSS imports on Windows when using Turbopack. It fixes backslash path separator handling and adds automatic includePaths for SCSS imports, ensuring the resolution of node_modules. A test is also included to verify Bootstrap SCSS compatibility with Turbopack.

Why?

Addressing these issues ensures compatibility and reliability when using SCSS in Turbopack projects, especially with Bootstrap on Windows systems.

How?

  • Automatic includePaths configuration adds node_modules for SCSS imports.
  • Resource paths are normalized before reaching sass-loader on Windows.
  • A test verifies seamless SCSS import resolution with Bootstrap.

Closes #86431 Fixes #86431

Changed files

  • crates/next-core/src/next_shared/webpack_rules/sass.rs (modified, +34/-2)
  • test/production/app-dir/turbopack-bootstrap-scss-windows/app/globals.scss (added, +15/-0)
  • test/production/app-dir/turbopack-bootstrap-scss-windows/app/layout.tsx (added, +18/-0)
  • test/production/app-dir/turbopack-bootstrap-scss-windows/app/page.tsx (added, +12/-0)
  • test/production/app-dir/turbopack-bootstrap-scss-windows/index.test.ts (added, +43/-0)
  • test/production/app-dir/turbopack-bootstrap-scss-windows/next.config.js (added, +6/-0)
  • turbopack/crates/turbopack-node/js/src/transforms/webpack-loaders.ts (modified, +7/-1)

PR #1041: Lib check

Description (problem / solution / changelog)

<!-- This is an auto-generated comment: release notes by coderabbit.ai -->

Summary by CodeRabbit

  • New Features

    • Certificate Authority management supporting multiple provider types and batch operations.
    • Login and registration pages with client-side validation and protected-route redirects for unauthenticated users.
    • Secure session handling via httpOnly cookies and a type-safe API client for auth flows.
  • Chores

    • Added repository workspace configuration, package manifests, and README for the API client.
    • Enabled automated pre-merge security and documentation checks.

<sub>✏️ Tip: You can customize this high-level summary in your review settings.</sub>

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

Changed files

  • .coderabbit.yaml (added, +10/-0)
  • fools/file.go (added, +764/-0)
  • fools/go.mod (added, +3/-0)
  • fools/go.sum (added, +0/-0)
  • subscription-tracker-pr59/apps/web/package.json (added, +34/-0)
  • subscription-tracker-pr59/apps/web/src/app/(auth)/login/page.tsx (added, +130/-0)
  • subscription-tracker-pr59/apps/web/src/app/(auth)/register/page.tsx (added, +225/-0)
  • subscription-tracker-pr59/apps/web/src/app/api/session/route.ts (added, +47/-0)
  • subscription-tracker-pr59/apps/web/src/lib/validations/auth.ts (added, +43/-0)
  • subscription-tracker-pr59/apps/web/src/proxy.ts (added, +39/-0)
  • subscription-tracker-pr59/package.json (added, +9/-0)
  • subscription-tracker-pr59/packages/api-client/README.md (added, +23/-0)
  • subscription-tracker-pr59/packages/api-client/package.json (added, +18/-0)
  • subscription-tracker-pr59/packages/api-client/src/index.ts (added, +49/-0)
  • subscription-tracker-pr59/packages/api-client/src/types.ts (added, +29/-0)
  • subscription-tracker-pr59/packages/api-client/tsconfig.json (added, +9/-0)
  • subscription-tracker-pr59/packages/config/package.json (added, +5/-0)
  • subscription-tracker-pr59/packages/config/tsconfig.base.json (added, +14/-0)
  • subscription-tracker-pr59/pnpm-lock.yaml (added, +4191/-0)
  • subscription-tracker-pr59/pnpm-workspace.yaml (added, +3/-0)

Code Example

4.

---

### Current vs. Expected behavior

on step 4. build must succeed, but instead it fails on:

---

Doing the same on Debian 11 via WSL, with Node 22.x:

---

### Provide environment information

---

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

Turbopack

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

next build (local), next dev (local)

### Additional context

Another quick-fix as mentioned in [this comment](https://github.com/vercel/next.js/discussions/77721#discussioncomment-14822509) is to use ``--webpack`` on Windows.
RAW_BUFFERClick to expand / collapse

Link to the code that reproduces this issue

https://github.com/w7rus/nextjs16-turbopack-bootstrap-windows

To Reproduce

  1. Use Windows 10/11
  2. Use Node 22.x
  3. npm i
  4. node node_modules/next/dist/bin/next build --turbopack

Current vs. Expected behavior

on step 4. build must succeed, but instead it fails on:

PS C:\Users\admin\Desktop\proj> node node_modules\next\dist\bin\next build --turbopack
   ▲ Next.js 16.0.3 (Turbopack)

   Creating an optimized production build ...

...

> Build error occurred
Error: Turbopack build failed with 1 errors:
./src/styles/my-bootstrap.scss
Error evaluating Node.js code
Error: Can't find stylesheet to import.
1753 │ @import "variables-dark"; // TODO: can be removed safely in v6, only here to avoid breaking changes in v5.3
     │         ^^^^^^^^^^^^^^^^
  node_modules\bootstrap\scss\_variables.scss 1753:9  @import
  src\styles\my-bootstrap.scss 5:9                    root stylesheet
Caused by: Error: Can't find stylesheet to import.
1753 │ @import "variables-dark"; // TODO: can be removed safely in v6, only here to avoid breaking changes in v5.3
     │         ^^^^^^^^^^^^^^^^
  node_modules\bootstrap\scss\_variables.scss 1753:9  @import
  src\styles\my-bootstrap.scss 5:9                    root stylesheet
    [at Object.wrapException (C:\Users\admin\Desktop\proj\node_modules\sass\sass.dart.js:2316:47)]
    [at C:\Users\admin\Desktop\proj\node_modules\sass\sass.dart.js:88031:25]
    [at _wrapJsFunctionForAsync_closure.$protected (C:\Users\admin\Desktop\proj\node_modules\sass\sass.dart.js:4984:15)]
    [at _wrapJsFunctionForAsync_closure.call$2 (C:\Users\admin\Desktop\proj\node_modules\sass\sass.dart.js:38319:12)]
    [at _awaitOnObject_closure.call$1 (C:\Users\admin\Desktop\proj\node_modules\sass\sass.dart.js:38307:32)]
    [at Object._rootRunUnary (C:\Users\admin\Desktop\proj\node_modules\sass\sass.dart.js:5402:18)]
    [at StaticClosure.<anonymous> (C:\Users\admin\Desktop\proj\node_modules\sass\sass.dart.js:125885:16)]
    [at _CustomZone.runUnary$2$2 (C:\Users\admin\Desktop\proj\node_modules\sass\sass.dart.js:39750:39)]
    [at _Future__propagateToListeners_handleValueCallback.call$0 (C:\Users\admin\Desktop\proj\node_modules\sass\sass.dart.js:38808:51)]
    [at Object._Future__propagateToListeners (C:\Users\admin\Desktop\proj\node_modules\sass\sass.dart.js:5194:93)]


    at ignore-listed frames

Doing the same on Debian 11 via WSL, with Node 22.x:

w7rus@W7RUS-PC:/mnt/c/Users/admin/Desktop/proj$ node node_modules/next/dist/bin/next build --turbopack
   ▲ Next.js 16.0.3 (Turbopack)

   Creating an optimized production build ...

...

Specified module format (EcmaScript Modules) is not matching the module format of the source code (CommonJs)
The EcmaScript module format was specified in the package.json that is affecting this source file or by using an special extension, but it looks like that CommonJs syntax is used in the source code.
Exports made by CommonJs syntax will lead to a runtime error, since the module is in EcmaScript mode. Either change the "type" field in the package.json or replace CommonJs syntax with EcmaScript import/export syntax in the source file.


 ✓ Compiled successfully in 20.4s
 ✓ Finished TypeScript in 9.7s
 ✓ Collecting page data using 3 workers in 3.1s
 ✓ Generating static pages using 3 workers (4/4) in 4.2s
 ✓ Finalizing page optimization in 9.9s

Route (app)
┌ ○ /
└ ○ /_not-found


○  (Static)  prerendered as static content

Provide environment information

Operating System:
  Platform: win32
  Arch: x64
  Version: Windows 11 IoT Enterprise LTSC 2024
  Available memory (MB): 65281
  Available CPU cores: 20
Binaries:
  Node: 22.16.0
  npm: 11.6.3
  Yarn: 1.22.22
  pnpm: N/A
Relevant Packages:
  next: 16.0.3 // Latest available version is detected (16.0.3).
  eslint-config-next: N/A
  react: 19.2.0
  react-dom: 19.2.0
  typescript: 5.9.3
Next.js Config:
  output: standalone

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

Turbopack

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

next build (local), next dev (local)

Additional context

Another quick-fix as mentioned in this comment is to use --webpack on Windows.

PS C:\Users\admin\Desktop\proj> node node_modules\next\dist\bin\next build --webpack
   ▲ Next.js 16.0.3 (webpack)

   Creating an optimized production build ...

...

 ✓ Compiled successfully in 7.0s
 ✓ Finished TypeScript in 1221.4ms
 ✓ Collecting page data using 19 workers in 377.3ms
 ✓ Generating static pages using 19 workers (4/4) in 486.5ms
 ✓ Collecting build traces in 14.8s
 ✓ Finalizing page optimization in 15.2s

Route (app)
┌ ○ /
└ ○ /_not-found


○  (Static)  prerendered as static content

extent analysis

TL;DR

The most likely fix for the Turbopack build failure on Windows is to use the --webpack flag instead of relying on Turbopack.

Guidance

  1. Identify the root cause: The error message suggests that there's an issue with importing stylesheets in the my-bootstrap.scss file, specifically with the @import "variables-dark"; line. However, the fact that using --webpack resolves the issue implies that the problem might be related to Turbopack's handling of imports on Windows.
  2. Verify the fix: Run the build command with the --webpack flag, as shown in the additional context section, to see if it successfully compiles the project.
  3. Consider the implications: Using --webpack instead of Turbopack might have performance implications, as Turbopack is designed to be faster. However, if Turbopack is not working correctly on Windows, using Webpack might be a necessary workaround.
  4. Investigate further: If possible, try to identify why Turbopack is failing to import the stylesheet on Windows. This might involve checking the file paths, permissions, and the my-bootstrap.scss file itself.

Example

No code snippet is provided, as the issue seems to be related to the build process rather than a specific code error.

Notes

The provided information suggests that the issue is specific to Windows and Turbopack. The fact that using --webpack resolves the issue implies that the problem might be related to Turbopack's handling of imports on Windows. However, without more information, it's difficult to provide a more specific solution.

Recommendation

Apply the workaround by using the --webpack flag when running the build command, as it has been shown to successfully compile the project. This is a temporary solution until the underlying issue with Turbopack on Windows can be resolved.

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