Help - Lightning CSS causing builds to fail

Currently the build fails due to lightning css
I expect the builds to complete

Main Error: Error: Cannot find module ‘../lightningcss.linux-x64-gnu.node’

package.json

{
  "name": "quratr",
  "version": "0.2.1",
  "private": true,
  "scripts": {
    "dev": "next dev --turbopack",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "@heroui/react": "^2.8.1",
    "@heroui/system": "^2.4.19",
    "@heroui/theme": "^2.4.19",
    "@react-spring/web": "^9.7.5",
    "@statsig/react-bindings": "^3.18.2",
    "@statsig/web-analytics": "^3.18.2",
    "@supabase/ssr": "^0.6.1",
    "@supabase/supabase-js": "^2.50.4",
    "@tabler/icons-react": "^3.34.0",
    "@tailwindcss/postcss": "^4.1.11",
    "@vercel/analytics": "^1.5.0",
    "@vercel/speed-insights": "^1.2.0",
    "axios": "^1.10.0",
    "babel-plugin-react-compiler": "^19.0.0-beta-e993439-20250328",
    "browser-image-compression": "^2.0.2",
    "clsx": "^2.1.1",
    "date-fns": "^4.1.0",
    "framer-motion": "^12.23.6",
    "lucide-react": "^0.441.0",
    "motion": "^12.23.1",
    "next": "^15.3.5",
    "next-sitemap": "^4.2.3",
    "next-themes": "^0.3.0",
    "react": "19.0.0",
    "react-card-flip": "^1.2.3",
    "react-dom": "19.0.0",
    "react-google-recaptcha-v3": "^1.11.0",
    "react-password-strength-bar": "^0.4.1",
    "react-simple-star-rating": "^5.1.7",
    "react-tinder-card": "^1.6.4",
    "react-web-share": "^2.0.2",
    "sharp": "^0.34.3",
    "tailwind-merge": "^2.6.0",
    "zustand": "^5.0.6"
  },
  "devDependencies": {
    "@tailwindcss/typography": "^0.5.16",
    "@types/node": "^20.19.6",
    "@types/react": "19.0.9",
    "@types/react-dom": "19.0.3",
    "@types/react-google-recaptcha": "^2.1.9",
    "eslint": "^8.57.1",
    "eslint-config-next": "15.1.7",
    "postcss": "^8.5.6",
    "prettier": "^3.6.2",
    "prettier-plugin-tailwindcss": "^0.6.14",
    "tailwindcss": "^4.1.11",
    "typescript": "^5.8.3"
  },
  "overrides": {
    "@types/react": "19.0.9",
    "@types/react-dom": "19.0.3"
  }
}

nextConfig

/** @type {import('next').NextConfig} */
const nextConfig = {
  images: {
    remotePatterns: [
      {
        protocol: "https",
        hostname: "**",
      },
    ],
  },
  experimental: {
    staleTimes: {
      dynamic: 0,
    },
    useLightningcss: false,
    // reactCompiler: true,
  },
};

export default nextConfig;

build logs

[10:04:36.079] Running build in Washington, D.C., USA (East) – iad1
[10:04:36.079] Build machine configuration: 2 cores, 8 GB
[10:04:36.097] Cloning github.com/Shivansh-Verma7719/quratr (Branch: placesv2, Commit: 7987449)
[10:04:37.418] Cloning completed: 1.320s
[10:04:40.401] Restored build cache from previous deployment (54bRP5pDcNx6t2KKedKGCS2vhpBi)
[10:04:43.962] Running "vercel build"
[10:04:44.436] Vercel CLI 44.5.0
[10:04:44.810] Installing dependencies...
[10:04:49.820] 
[10:04:49.821] added 20 packages, removed 72 packages, and changed 88 packages in 4s
[10:04:49.821] 
[10:04:49.822] 150 packages are looking for funding
[10:04:49.822]   run `npm fund` for details
[10:04:49.833] Detected Next.js version: 15.3.5
[10:04:49.838] Running "npm run build"
[10:04:49.962] 
[10:04:49.962] > quratr@0.2.1 build
[10:04:49.962] > next build
[10:04:49.962] 
[10:04:50.671]    ▲ Next.js 15.3.5
[10:04:50.672]    - Experiments (use with caution):
[10:04:50.673]      · staleTimes
[10:04:50.673] 
[10:04:50.747]    Creating an optimized production build ...
[10:05:07.539] <w> [webpack.cache.PackFileCacheStrategy] Serializing big strings (100kiB) impacts deserialization performance (consider using Buffer instead and decode when needed)
[10:05:18.280] Failed to compile.
[10:05:18.280] 
[10:05:18.281] ./app/globals.css.webpack[javascript/auto]!=!./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[3]!./app/globals.css
[10:05:18.281] Error: Cannot find module '../lightningcss.linux-x64-gnu.node'
[10:05:18.281] Require stack:
[10:05:18.281] - /vercel/path0/node_modules/lightningcss/node/index.js
[10:05:18.281] - /vercel/path0/node_modules/@tailwindcss/node/dist/index.js
[10:05:18.282] - /vercel/path0/node_modules/@tailwindcss/postcss/dist/index.js
[10:05:18.282] - /vercel/path0/node_modules/next/dist/build/webpack/config/blocks/css/plugins.js
[10:05:18.282] - /vercel/path0/node_modules/next/dist/build/webpack/config/blocks/css/index.js
[10:05:18.282] - /vercel/path0/node_modules/next/dist/build/webpack/config/index.js
[10:05:18.282] - /vercel/path0/node_modules/next/dist/build/webpack-config.js
[10:05:18.282] - /vercel/path0/node_modules/next/dist/build/webpack-build/impl.js
[10:05:18.282] - /vercel/path0/node_modules/next/dist/compiled/jest-worker/processChild.js
[10:05:18.283]     at Module._resolveFilename (node:internal/modules/cjs/loader:1212:15)
[10:05:18.283]     at /vercel/path0/node_modules/next/dist/server/require-hook.js:55:36
[10:05:18.283]     at Module._load (node:internal/modules/cjs/loader:1043:27)
[10:05:18.283]     at Module.require (node:internal/modules/cjs/loader:1298:19)
[10:05:18.283]     at mod.require (/vercel/path0/node_modules/next/dist/server/require-hook.js:65:28)
[10:05:18.283]     at require (node:internal/modules/helpers:182:18)
[10:05:18.283]     at Object.<anonymous> (/vercel/path0/node_modules/lightningcss/node/index.js:22:22)
[10:05:18.284]     at Module._compile (node:internal/modules/cjs/loader:1529:14)
[10:05:18.284]     at Module._extensions..js (node:internal/modules/cjs/loader:1613:10)
[10:05:18.284]     at Module.load (node:internal/modules/cjs/loader:1275:32)
[10:05:18.284] 
[10:05:18.284] Import trace for requested module:
[10:05:18.284] ./app/globals.css.webpack[javascript/auto]!=!./node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[2]!./node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[3]!./app/globals.css
[10:05:18.284] ./app/globals.css
[10:05:18.285] 
[10:05:18.285] ./app/globals.css
[10:05:18.285] Error: Cannot find module '../lightningcss.linux-x64-gnu.node'
[10:05:18.285] Require stack:
[10:05:18.285] - /vercel/path0/node_modules/lightningcss/node/index.js
[10:05:18.285] - /vercel/path0/node_modules/@tailwindcss/node/dist/index.js
[10:05:18.286] - /vercel/path0/node_modules/@tailwindcss/postcss/dist/index.js
[10:05:18.286] - /vercel/path0/node_modules/next/dist/build/webpack/config/blocks/css/plugins.js
[10:05:18.286] - /vercel/path0/node_modules/next/dist/build/webpack/config/blocks/css/index.js
[10:05:18.286] - /vercel/path0/node_modules/next/dist/build/webpack/config/index.js
[10:05:18.286] - /vercel/path0/node_modules/next/dist/build/webpack-config.js
[10:05:18.286] - /vercel/path0/node_modules/next/dist/build/webpack-build/impl.js
[10:05:18.286] - /vercel/path0/node_modules/next/dist/compiled/jest-worker/processChild.js
[10:05:18.287]     at Module._resolveFilename (node:internal/modules/cjs/loader:1212:15)
[10:05:18.287]     at /vercel/path0/node_modules/next/dist/server/require-hook.js:55:36
[10:05:18.287]     at Module._load (node:internal/modules/cjs/loader:1043:27)
[10:05:18.287]     at Module.require (node:internal/modules/cjs/loader:1298:19)
[10:05:18.288]     at mod.require (/vercel/path0/node_modules/next/dist/server/require-hook.js:65:28)
[10:05:18.288]     at require (node:internal/modules/helpers:182:18)
[10:05:18.288]     at Object.<anonymous> (/vercel/path0/node_modules/lightningcss/node/index.js:22:22)
[10:05:18.289]     at Module._compile (node:internal/modules/cjs/loader:1529:14)
[10:05:18.289]     at Module._extensions..js (node:internal/modules/cjs/loader:1613:10)
[10:05:18.289]     at Module.load (node:internal/modules/cjs/loader:1275:32)
[10:05:18.292]     at tryRunOrWebpackError (/vercel/path0/node_modules/next/dist/compiled/webpack/bundle5.js:29:316142)
[10:05:18.299]     at __webpack_require_module__ (/vercel/path0/node_modules/next/dist/compiled/webpack/bundle5.js:29:131548)
[10:05:18.299]     at __nested_webpack_require_161494__ (/vercel/path0/node_modules/next/dist/compiled/webpack/bundle5.js:29:130983)
[10:05:18.299]     at /vercel/path0/node_modules/next/dist/compiled/webpack/bundle5.js:29:131840
[10:05:18.300]     at symbolIterator (/vercel/path0/node_modules/next/dist/compiled/neo-async/async.js:1:14444)
[10:05:18.300]     at done (/vercel/path0/node_modules/next/dist/compiled/neo-async/async.js:1:14824)
[10:05:18.300]     at Hook.eval [as callAsync] (eval at create (/vercel/path0/node_modules/next/dist/compiled/webpack/bundle5.js:14:9224), <anonymous>:15:1)
[10:05:18.301]     at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (/vercel/path0/node_modules/next/dist/compiled/webpack/bundle5.js:14:6378)
[10:05:18.301]     at /vercel/path0/node_modules/next/dist/compiled/webpack/bundle5.js:29:130703
[10:05:18.301]     at symbolIterator (/vercel/path0/node_modules/next/dist/compiled/neo-async/async.js:1:14402)
[10:05:18.301] -- inner error --
[10:05:18.302] Error: Cannot find module '../lightningcss.linux-x64-gnu.node'
[10:05:18.302] Require stack:
[10:05:18.302] - /vercel/path0/node_modules/lightningcss/node/index.js
[10:05:18.302] - /vercel/path0/node_modules/@tailwindcss/node/dist/index.js
[10:05:18.303] - /vercel/path0/node_modules/@tailwindcss/postcss/dist/index.js
[10:05:18.303] - /vercel/path0/node_modules/next/dist/build/webpack/config/blocks/css/plugins.js
[10:05:18.303] - /vercel/path0/node_modules/next/dist/build/webpack/config/blocks/css/index.js
[10:05:18.304] - /vercel/path0/node_modules/next/dist/build/webpack/config/index.js
[10:05:18.304] - /vercel/path0/node_modules/next/dist/build/webpack-config.js
[10:05:18.304] - /vercel/path0/node_modules/next/dist/build/webpack-build/impl.js
[10:05:18.304] - /vercel/path0/node_modules/next/dist/compiled/jest-worker/processChild.js
[10:05:18.305]     at Module._resolveFilename (node:internal/modules/cjs/loader:1212:15)
[10:05:18.305]     at /vercel/path0/node_modules/next/dist/server/require-hook.js:55:36
[10:05:18.305]     at Module._load (node:internal/modules/cjs/loader:1043:27)
[10:05:18.305]     at Module.require (node:internal/modules/cjs/loader:1298:19)
[10:05:18.306]     at mod.require (/vercel/path0/node_modules/next/dist/server/require-hook.js:65:28)
[10:05:18.306]     at require (node:internal/modules/helpers:182:18)
[10:05:18.306]     at Object.<anonymous> (/vercel/path0/node_modules/lightningcss/node/index.js:22:22)
[10:05:18.307]     at Module._compile (node:internal/modules/cjs/loader:1529:14)
[10:05:18.307]     at Module._extensions..js (node:internal/modules/cjs/loader:1613:10)
[10:05:18.307]     at Module.load (node:internal/modules/cjs/loader:1275:32)
[10:05:18.307]     at Object.<anonymous> (/vercel/path0/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[2]!/vercel/path0/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[3]!/vercel/path0/app/globals.css:1:7)
[10:05:18.308]     at /vercel/path0/node_modules/next/dist/compiled/webpack/bundle5.js:29:962742
[10:05:18.308]     at Hook.eval [as call] (eval at create (/vercel/path0/node_modules/next/dist/compiled/webpack/bundle5.js:14:9002), <anonymous>:7:1)
[10:05:18.308]     at Hook.CALL_DELEGATE [as _call] (/vercel/path0/node_modules/next/dist/compiled/webpack/bundle5.js:14:6272)
[10:05:18.308]     at /vercel/path0/node_modules/next/dist/compiled/webpack/bundle5.js:29:131581
[10:05:18.309]     at tryRunOrWebpackError (/vercel/path0/node_modules/next/dist/compiled/webpack/bundle5.js:29:316096)
[10:05:18.309]     at __webpack_require_module__ (/vercel/path0/node_modules/next/dist/compiled/webpack/bundle5.js:29:131548)
[10:05:18.309]     at __nested_webpack_require_161494__ (/vercel/path0/node_modules/next/dist/compiled/webpack/bundle5.js:29:130983)
[10:05:18.310]     at /vercel/path0/node_modules/next/dist/compiled/webpack/bundle5.js:29:131840
[10:05:18.310]     at symbolIterator (/vercel/path0/node_modules/next/dist/compiled/neo-async/async.js:1:14444)
[10:05:18.310] 
[10:05:18.310] Generated code for /vercel/path0/node_modules/next/dist/build/webpack/loaders/css-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[2]!/vercel/path0/node_modules/next/dist/build/webpack/loaders/postcss-loader/src/index.js??ruleSet[1].rules[13].oneOf[10].use[3]!/vercel/path0/app/globals.css
[10:05:18.311] 
[10:05:18.311] Import trace for requested module:
[10:05:18.311] ./app/globals.css
[10:05:18.313] 
[10:05:18.313] 
[10:05:18.313] > Build failed because of webpack errors
[10:05:18.344] Error: Command "npm run build" exited with 1
[10:05:18.812] 
[10:05:21.920] Exiting build container

I have tried with useLightningcss on as well but still the same thing happens

Build completes perfectly on local

Hi @shivansh-verma7719, welcome to the Vercel Community!

I’m sorry that you are facing this issue. Have you tried the solutions suggested in this post: Next/font error, missing lightningcss.linux-x64-gnu.node on deployment - #11 by elv1s42?

It might be worth trying suggestions from other community posts. Let me know if it works.

Hey @anshumanb thank you for the ref.
The only fix that worked was

  • Delete package-lock.json
  • Run npm install to get an updated package-lock.json

Referencing this here for future devs

1 Like

Glad you found a fix. Thanks for sharing the solution here.

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.