Issue Station
Sign In
Tools hereToolbox

nextjs - ✅(Solved) Fix Turbopack sass output has lower decimal precision than Webpack [1 pull requests, 1 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#91862•Fetched 2026-04-08 01:20:38
View on GitHub
Comments
0
Participants
1
Timeline
7
Reactions
1
Author
carloscuestacarloscuesta
Participants
carloscuestacarloscuesta
Timeline (top)
labeled ×2closed ×1cross-referenced ×1issue_type_added ×1

Fix Action

Fixed

PR fix notes

PR #91909: docs: document CSS decimal precision difference between Turbopack and webpack

Description (problem / solution / changelog)

Description

Documents the CSS decimal precision difference between Turbopack and webpack in the Turbopack docs page under "Known gaps with webpack".

Turbopack uses Lightning CSS which outputs 5 digits of decimal precision for numeric CSS values, while webpack uses 10 digits. This applies to both plain CSS and Sass/SCSS output.

Closes https://github.com/vercel/next.js/issues/91862

Changed files

  • docs/01-app/03-api-reference/08-turbopack.mdx (modified, +9/-0)

Code Example

npm run build:webpack

---

find .next -name '*.css' -exec cat {} + > ./webpack.css

---

npm run build:turbopack

---

find .next -name '*.css' -exec cat {} + > ./turbopack.css

---

diff webpack.css turbopack.css

---

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 25.3.0: Wed Jan 28 20:54:46 PST 2026; root:xnu-12377.91.3~2/RELEASE_ARM64_T6000
  Available memory (MB): 16384
  Available CPU cores: 8
Binaries:
  Node: 24.11.1
  npm: 11.6.2
  Yarn: 1.22.22
  pnpm: N/A
Relevant Packages:
  next: 16.2.1 // Latest available version is detected (16.2.1).
  eslint-config-next: N/A
  react: 19.2.4
  react-dom: 19.2.4
  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/carloscuesta/nextjs-webpack-vs-turbopack-sass

To Reproduce

  1. Clone the reproduction repository.
  2. Install dependencies with npm install.
  3. Build the project using Webpack:
npm run build:webpack
  1. Copy generated CSS into a webpack.css file:
find .next -name '*.css' -exec cat {} + > ./webpack.css
  1. Build the project using Turbopack:
npm run build:turbopack
  1. Copy generated CSS into a turbopack.css file:
find .next -name '*.css' -exec cat {} + > ./turbopack.css
  1. Do a diff of both files (look at line-height property):
  • Webpack line-height: 1.4705882353 (10 digits of precision)
  • Turbopack line-height: 1.47059 (5 digits of precision)
diff webpack.css turbopack.css

Current vs. Expected behavior

Following the steps from the previous section, I expected both compilers to have the same rounding precision 10 digits, but I observed that Turbopack trims down to 5 digits.

Provide environment information

Operating System:
  Platform: darwin
  Arch: arm64
  Version: Darwin Kernel Version 25.3.0: Wed Jan 28 20:54:46 PST 2026; root:xnu-12377.91.3~2/RELEASE_ARM64_T6000
  Available memory (MB): 16384
  Available CPU cores: 8
Binaries:
  Node: 24.11.1
  npm: 11.6.2
  Yarn: 1.22.22
  pnpm: N/A
Relevant Packages:
  next: 16.2.1 // Latest available version is detected (16.2.1).
  eslint-config-next: N/A
  react: 19.2.4
  react-dom: 19.2.4
  typescript: 5.9.3
Next.js Config:
  output: N/A

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

CSS, Turbopack

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

next dev (local), next build (local), next start (local), Vercel (Deployed), Other (Deployed)

Additional context

No response

extent analysis

Fix Plan

To fix the issue of different rounding precision for line-height property between Webpack and Turbopack, we need to configure Turbopack to match Webpack's precision.

Here are the steps:

  • Update next.config.js to include a custom Webpack configuration for Turbopack.
  • Use the css-loader options to specify the rounding precision.

Example code:

// next.config.js
module.exports = {
  //... other configurations ...
  turbopack: {
    css: {
      loader: 'css-loader',
      options: {
        precision: 10, // Set precision to 10 digits
      },
    },
  },
}

Alternatively, if you are using a separate turbopack.config.js file, you can add the following configuration:

// turbopack.config.js
module.exports = {
  //... other configurations ...
  css: {
    loader: 'css-loader',
    options: {
      precision: 10, // Set precision to 10 digits
    },
  },
}

Verification

To verify that the fix worked, rebuild the project using Turbopack and compare the generated CSS files:

npm run build:turbopack
find .next -name '*.css' -exec cat {} + > ./turbopack.css
diff webpack.css turbopack.css

The diff command should no longer show differences in the line-height property.

Extra Tips

  • Make sure to update the css-loader version to the latest available, as older versions may not support the precision option.
  • If you are using a custom CSS loader, ensure that it supports the precision option or configure it accordingly.

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…
#dependency error#configuration error#environment variable#network issue#logging issue

Still need to ship something?

×6

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

Back to top recommendations

TRENDING