saadeghi/daisyui · error · Error

No component docs page maps to ${cssFilename}

Error message

No component docs page maps to ${cssFilename}

What it means

Thrown by buildPreviewInputs when a planned component change could not be mapped to any docs page: neither the preferred head docs index (for <name>.css) nor the fallback base docs index had a +page.md whose `source:` frontmatter references that CSS filename.

Source

Thrown at packages/tailwind-play-share/pr-preview.mjs:521

  }

  const cssFiles = plan.headCssPaths.map((filePath) => {
    const css = readFileAtRevision(headSha, filePath)
    assertSafePrCss(css, filePath)
    return { componentName: componentNameFromPath(filePath), css }
  })

  const headDocs = buildDocsIndex(headSha)
  const baseDocs = buildDocsIndex(baseSha)
  const pagesByPath = new Map()

  for (const target of plan.docsTargets) {
    const preferred = target.preferredCssFilename && headDocs.get(target.preferredCssFilename)
    const fallback = target.fallbackCssFilename && baseDocs.get(target.fallbackCssFilename)
    const pages = preferred?.length ? preferred : fallback
    if (!pages?.length) {
      const cssFilename = target.preferredCssFilename ?? target.fallbackCssFilename
      throw new Error(`No component docs page maps to ${cssFilename}`)
    }
    for (const page of pages) pagesByPath.set(page.filePath, page)
  }

  const pages = [...pagesByPath.values()].sort((left, right) =>
    left.filePath.localeCompare(right.filePath),
  )
  return {
    afterCss: buildAfterCss(plan.excludeNames, cssFiles),
    beforeCss: buildBeforeCss(),
    components: plan.excludeNames,
    docsPages: pages.map(({ filePath }) => filePath),
    html: combineHtmlExamples(pages),
  }
}

export async function generatePrPreview({
  baseSha,

View on GitHub (pinned to 42b09e637e)

Solutions

  1. Add or update a docs page under packages/docs/src/routes/(routes)/components/<name>/+page.md with a `source: .../<name>.css` frontmatter line.
  2. For renamed components, update the docs page route/source to match the new CSS filename.
  3. Re-run; the error names the cssFilename that lacks a mapping.

Example fix

<!-- before: no docs page maps to new-comp.css -->

<!-- after: packages/docs/src/routes/(routes)/components/new-comp/+page.md -->
---
source: ../components/new-comp.css
---

```html
<div class="new-comp">...</div>
```
Defensive patterns

Strategy: validation

Validate before calling

import { execSync } from "node:child_process"
function assertDocsMappingExists(cssFilename, revision = "HEAD") {
  const pages = execSync(`git ls-tree -r --name-only -z ${revision} -- packages/docs/src/routes/(routes)/components`, { encoding: "utf8" }).split("\0").filter((p) => p.endsWith("/+page.md"))
  for (const p of pages) {
    const md = execSync(`git show ${revision}:${p}`, { encoding: "utf8" })
    if (new RegExp(`^source:\\s+\\S*\\/\\Q${cssFilename}\\E\\s*$`, "m").test(md)) return
  }
  throw new Error(`No component docs page maps to ${cssFilename}`)
}

Try / catch

try {
  inputs = buildPreviewInputs(baseSha, headSha)
} catch (error) {
  if (/No component docs page maps to /.test(error.message)) {
  // add a +page.md with `source: .../<name>.css` for the named component, then re-run
  }
  throw error
}

Prevention

When it happens

Trigger: For a docsTargets entry, headDocs.get(target.preferredCssFilename) is empty/undefined and baseDocs.get(target.fallbackCssFilename) is also empty/undefined, so `!pages?.length` fires.

Common situations: A PR adds/renames a component CSS file (e.g. new-comp.css) without a corresponding docs page whose `source:` line points at new-comp.css, a renamed component whose docs page was not renamed, or a docs page missing the `source:` frontmatter line.

Related errors


AI-assisted analysis of saadeghi/daisyui@42b09e637e (2026-08-13). Data as JSON: /api/errors/4893819e1d54ee38. Report an issue: GitHub.