Skip to content

Presence of & in html for breadcrumbs breaks tailwind plugins. #55

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
Daedalus11069 opened this issue Apr 13, 2025 · 0 comments
Open

Comments

@Daedalus11069
Copy link

On a fresh install + the addition of a tailwind plugin such as flowbite or daisyui, the below presence of the & word/html entity in the breadcrumbs.blade.php file breaks vite's build process. I cannot decipher why this is exactly, but something between that word and tailwind's utilities import (when testing originally, if I were to comment out the @import 'tailwindcss/utilities'; line, the code wouldn't break entirely) causes vite's postcss to break.

The error message that pops up is almost entirely unhelpful for tracing purposes, but that's not the fault of this boilerplate.

<ol class="inline-flex max-w-6xl mx-auto items-center w-full py-2 px-8 mb-3 space-x-3 text-sm text-slate-800/70 dark:text-white/70 [&amp;_.active-breadcrumb]:text-neutral-500/80 sm:mb-0">

For reference, here is the app.css file to reproduce the error referenced above, assuming that daisyUI is installed at 5.0.19 with Tailwindcss at 4.1.3:

@import 'tailwindcss';
@plugin "daisyui" {
    themes: light --default, dark --prefersdark;
}

However, this error is also present if Flowbite is used at the latest stable (at the time of this writing: 3.1.2)

The error message, even as nearly useless as it is:

[vite] Internal server error: [postcss] G:/<redacted>/resources/css/app.css:4089:5: Unknown word &amp
  Plugin: vite:css
  File: G:/<redacted>/resources/css/app.css:4089:4
      at Input.error (G:\<redacted>\node_modules\postcss\lib\input.js:113:16)       
      at Parser.unknownWord (G:\<redacted>\node_modules\postcss\lib\parser.js:595:22)
      at Parser.other (G:\<redacted>\node_modules\postcss\lib\parser.js:437:12)     
      at Parser.parse (G:\<redacted>\node_modules\postcss\lib\parser.js:472:16)     
      at parse (G:\<redacted>\node_modules\postcss\lib\parse.js:11:12)
      at new LazyResult (G:\<redacted>\node_modules\postcss\lib\lazy-result.js:165:16)
      at Processor.process (G:\<redacted>\node_modules\postcss\lib\processor.js:53:14)
      at compileCSS (file:///G:/<redacted>/node_modules/vite/dist/node/chunks/dep-M1IYMR16.js:48784:59)
      at async TransformPluginContext.transform (file:///G:/<redacted>/node_modules/vite/dist/node/chunks/dep-M1IYMR16.js:48039:11)
      at async EnvironmentPluginContainer.transform (file:///G:/<redacted>/node_modules/vite/dist/node/chunks/dep-M1IYMR16.js:47400:18)
      at async loadAndTransform (file:///G:/<redacted>/node_modules/vite/dist/node/chunks/dep-M1IYMR16.js:41198:27)

Simply removing the &amp; and replacing it with a & in the aforementioned breadcrumbs blade file fixes the build.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant