nextjs - 💡(How to fix) Fix sassOptions additionalData not working as expected - "Can't find stylesheet to import." [15 comments, 8 participants]

nextjs2025-10-27 22:05:05

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.

GitHub issue URL

Helpful · Quick feedback

GitHub stats

vercel/next.js#85424•Fetched 2026-04-08 02:15:51

View on GitHub

Comments

Participants

Timeline

Reactions

Author

Participants

Timeline (top)

subscribed ×16commented ×15unsubscribed ×6mentioned ×4

Error Message

Error evaluating Node.js code

Root Cause

Build Output

./ui/TestComponent.module.scss Error evaluating Node.js code Error: Can't find stylesheet to import. ╷ 1 │ @use "variables" as *; │ ^^^^^^^^^^^^^^^^^^^^^ ╵ ui/TestComponent.module.scss 1:1 root stylesheet Caused by: Error: Can't find stylesheet to import. ╷ 1 │ @use "variables" as *; │ ^^^^^^^^^^^^^^^^^^^^^ ╵ ui/TestComponent.module.scss 1:1 root stylesheet [at Object.wrapException (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:2292:47)] [at /Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:87606:25] [at _wrapJsFunctionForAsync_closure.$protected (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:4960:15)] [at _wrapJsFunctionForAsync_closure.call$2 (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:37968:12)] [at _awaitOnObject_closure.call$1 (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:37956:32)] [at Object._rootRunUnary (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:5378:18)] [at StaticClosure.<anonymous> (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:124712:16)] [at _CustomZone.runUnary$2$2 (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:39399:39)] [at _Future__propagateToListeners_handleValueCallback.call$0 (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:38457:51)] [at Object._Future__propagateToListeners (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:5170:93)]

Code Example

## Error Type
Build Error

## Error Message
Error evaluating Node.js code

## Build Output
./ui/TestComponent.module.scss
Error evaluating Node.js code
Error: Can't find stylesheet to import.
  ╷
1 │ @use "variables" as *;
  │ ^^^^^^^^^^^^^^^^^^^^^
  ╵
  ui/TestComponent.module.scss 1:1  root stylesheet
Caused by: Error: Can't find stylesheet to import.
  ╷
1 │ @use "variables" as *;
  │ ^^^^^^^^^^^^^^^^^^^^^
  ╵
  ui/TestComponent.module.scss 1:1  root stylesheet
    [at Object.wrapException (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:2292:47)]
    [at /Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:87606:25]
    [at _wrapJsFunctionForAsync_closure.$protected (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:4960:15)]
    [at _wrapJsFunctionForAsync_closure.call$2 (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:37968:12)]
    [at _awaitOnObject_closure.call$1 (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:37956:32)]
    [at Object._rootRunUnary (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:5378:18)]
    [at StaticClosure.<anonymous> (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:124712:16)]
    [at _CustomZone.runUnary$2$2 (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:39399:39)]
    [at _Future__propagateToListeners_handleValueCallback.call$0 (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:38457:51)]
    [at Object._Future__propagateToListeners (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:5170:93)]

Import trace:
  Server Component:
    ./ui/TestComponent.module.scss
    ./ui/TestComponent.tsx
    ./app/page.tsx

Next.js version: 16.0.0 (Turbopack)

---

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 22.3.0: Thu Jan  5 20:48:54 PST 2023; root:xnu-8792.81.2~2/RELEASE_ARM64_T6000
  Available memory (MB): 16384
  Available CPU cores: 10
Binaries:
  Node: 20.19.4
  npm: 11.6.2
  Yarn: N/A
  pnpm: N/A
Relevant Packages:
  next: 16.0.0 // Latest available version is detected (16.0.0).
  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/qjstuart/nextjs-sass-issue

To Reproduce

Start the applicaiton npm run dev
You should be faced with the following error:

## Error Type
Build Error

## Error Message
Error evaluating Node.js code

## Build Output
./ui/TestComponent.module.scss
Error evaluating Node.js code
Error: Can't find stylesheet to import.
  ╷
1 │ @use "variables" as *;
  │ ^^^^^^^^^^^^^^^^^^^^^
  ╵
  ui/TestComponent.module.scss 1:1  root stylesheet
Caused by: Error: Can't find stylesheet to import.
  ╷
1 │ @use "variables" as *;
  │ ^^^^^^^^^^^^^^^^^^^^^
  ╵
  ui/TestComponent.module.scss 1:1  root stylesheet
    [at Object.wrapException (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:2292:47)]
    [at /Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:87606:25]
    [at _wrapJsFunctionForAsync_closure.$protected (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:4960:15)]
    [at _wrapJsFunctionForAsync_closure.call$2 (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:37968:12)]
    [at _awaitOnObject_closure.call$1 (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:37956:32)]
    [at Object._rootRunUnary (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:5378:18)]
    [at StaticClosure.<anonymous> (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:124712:16)]
    [at _CustomZone.runUnary$2$2 (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:39399:39)]
    [at _Future__propagateToListeners_handleValueCallback.call$0 (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:38457:51)]
    [at Object._Future__propagateToListeners (/Users/quentin/Code/nextjs-sass-issue/nextjs-sass-issue/node_modules/sass/sass.dart.js:5170:93)]

Import trace:
  Server Component:
    ./ui/TestComponent.module.scss
    ./ui/TestComponent.tsx
    ./app/page.tsx

Next.js version: 16.0.0 (Turbopack)

Go into next.config.ts and comment out additionalData.
Go into TestComponent.module.scss and modify the @use statement to use the absolute path to the variables directory on your machine.
If you updated the @use statement with the correct absolute path, the error should go away, because sass can now access the $background variable.

Current vs. Expected behavior

I expected includePaths and additionalData to make the variables available inside my module files.

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 22.3.0: Thu Jan  5 20:48:54 PST 2023; root:xnu-8792.81.2~2/RELEASE_ARM64_T6000
  Available memory (MB): 16384
  Available CPU cores: 10
Binaries:
  Node: 20.19.4
  npm: 11.6.2
  Yarn: N/A
  pnpm: N/A
Relevant Packages:
  next: 16.0.0 // Latest available version is detected (16.0.0).
  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)

CSS

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

next dev (local), next build (local), next start (local)

Additional context

No response

extent analysis

TL;DR

The issue can be resolved by correctly configuring the includePaths or additionalData in the next.config.ts file to make the variables available inside the module files.

Guidance

Verify that the variables directory is correctly referenced in the @use statement, and consider using an absolute path as a temporary workaround.
Check the next.config.ts file to ensure that includePaths and additionalData are properly configured to include the variables directory.
Review the import trace to identify any potential issues with the file paths or dependencies.
Consider updating the next.config.ts file to use a more robust method of including the variables directory, such as using a relative path or a custom loader.

Example

No code example is provided as the issue is related to configuration and file paths.

Notes

The issue seems to be related to the configuration of the next.config.ts file and the way the variables directory is being referenced. The use of absolute paths as a temporary workaround suggests that there may be an issue with the way the file paths are being resolved.

Recommendation

Apply workaround: Update the next.config.ts file to correctly configure the includePaths or additionalData to make the variables available inside the module files, as this is the most likely cause of the issue.

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?

#batch processing #GPU compatibility #latency issue #model loading #dependency error

Still need to ship something?

×6

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

Data

Security

Network

Code

UI/UX

Text

System

Multimedia

Protocol

API

Engineering

nextjs - 💡(How to fix) Fix sassOptions additionalData not working as expected - "Can't find stylesheet to import." [15 comments, 8 participants]

Recommended Tools

GitHub issue graph ai analysis

Error Message

Root Cause

Build Output

Code Example

Link to the code that reproduces this issue

To Reproduce

Current vs. Expected behavior

Provide environment information

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

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

Additional context

extent analysis

TL;DR

Guidance

Example

Notes

Recommendation

Still need to ship something?

TRENDING

nextjs - 💡(How to fix) Fix sassOptions additionalData not working as expected - "Can't find stylesheet to import." [15 comments, 8 participants]

Recommended Tools

GitHub issue graph ai analysis

Error Message

Root Cause

Build Output

Code Example

Link to the code that reproduces this issue

To Reproduce

Current vs. Expected behavior

Provide environment information

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

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

Additional context

extent analysis

TL;DR

Guidance

Example

Notes

Recommendation

Still need to ship something?

RELATED_DISCOVERY

TRENDING