re: Using TailwindCSS with SvelteJS VIEW POST


I've noticed as soon as I import main.css, I lose the styles defined in my svelte components (using the style tag as normal). I don't mind so much as I prefer to do all my styling with Tailwind and using apply, but is that to be expected? Just want to make sure I'm not doing something wrong.


I've actually solved this, so the Svelte styles work as normal alongside Tailwind:

  • in rollup.config.js give a name to the extracted CSS so it doesn't clash with the CSS generated by Svelte, for example:
postcss({ extract: "public/tailwind.css" })
  • link that CSS from public/index.html
<link rel="stylesheet" href="/tailwind.css" />

  • add public/tailwind.css to .gitignore
code of conduct - report abuse