vercel/next.js · error · Error

Failed to load stylesheet: ${href}

Error message

Failed to load stylesheet: ${href}

What it means

`fetchStyleSheet` in route-loader.ts:292-311 fetches a route's CSS file and throws `Failed to load stylesheet: ${href}` when `res.ok` is false (non-2xx status). The error is then wrapped by `markAssetError`. This runs in the client during route transitions to inline CSS for the next page.

Source

Thrown at packages/next/src/client/route-loader.ts:303

      loadedScripts.set(src.toString(), (prom = appendScript(src)))
      return prom
    } else {
      return appendScript(src)
    }
  }

  function fetchStyleSheet(href: string): Promise<RouteStyleSheet> {
    let prom: Promise<RouteStyleSheet> | undefined = styleSheets.get(href)
    if (prom) {
      return prom
    }

    styleSheets.set(
      href,
      (prom = fetch(href, { credentials: 'same-origin' })
        .then((res) => {
          if (!res.ok) {
            throw new Error(`Failed to load stylesheet: ${href}`)
          }
          return res.text().then((text) => ({ href: href, content: text }))
        })
        .catch((err) => {
          throw markAssetError(err)
        }))
    )
    return prom
  }

  return {
    whenEntrypoint(route: string) {
      return withFuture(route, entrypoints)
    },
    onEntrypoint(route: string, execute: undefined | (() => unknown)) {
      ;(execute
        ? Promise.resolve()
            .then(() => execute())

View on GitHub (pinned to 0ae8c72462)

Solutions

1. Verify the CSS file in the error exists on the server/CDN under `/_next/static/css/`.
2. Redeploy the full `.next/static` directory so chunk hashes match the client bundle.
3. Purge the CDN cache for `_next/static/*` after a deploy.
4. Ensure `assetPrefix` points to a host that serves the same build's static assets.

Example fix

// Not a code fix — deploy/CDN issue.
// Ensure the full build output is deployed:
//   .next/static/** must match the client bundle's chunk references.
// next.config.js — check assetPrefix:
module.exports = { assetPrefix: process.env.CDN_URL /* must serve same build */ }

// Deploy-time: assert all referenced CSS chunks exist in .next/static/css.
// Build script example:
// After `next build`, verify hashes referenced in the build manifest
// are present on disk before shipping.

When it happens

Trigger: The browser fetches a stylesheet URL (e.g. `/_next/static/css/abc.css`) and the server returns a 404, 403, 500, or any non-2xx. Common when the build artifacts referenced by the current bundle do not exist on the serving host.

Common situations: Deploying only part of `.next/static`; a stale CDN cache pointing to deleted CSS chunks after a redeploy; `assetPrefix` pointing at a host missing the files; running `next start` against a different build than the one that generated the client bundle.

Related errors

• Failed to link project ${linkRes.stdout} ${linkRes.stderr} (
• Failed to deploy project ${linkRes.stdout} ${linkRes.stderr}
• Server Action "${actionId}" was not found on the server. Re
• Could not determine origin for forwarded Server Actions requ
• Invalid Server Action payload: failed to decrypt.

AI-assisted analysis of vercel/next.js@0ae8c72462 (2026-08-06). Data as JSON: /api/errors/b9b23f56a195188b. Report an issue: GitHub.