איך להשתמש ב-Tailwind כדי להוסיף נושאים ל-Discourse

מפתח
3

The approach I’ve taken can be found within this repository: GitHub - neo4j-contrib/discourse-theme-neo4j · GitHub

The essential points related to Tailwind:

  • A separate NPM target builds tailwind using postcss: "tailwind:dev": "postcss tailwind/global.scss -o assets/tailwind.css
  • The CSS output is placed in assets to be included with the theme. Notice that about.json includes the asset location.
  • The Discourse SCSS does not directly reference this produced CSS
  • Instead, there is a javascript initialiser at javascripts/discourse/initializers/tailwind-init.js.es6 which appends the asset to the end of the discourse-assets-stylesheets element as a new link element
  • Important: the Tailwind preflight is disabled in the tailwind.config.js, because it would otherwise reset all preceding CSS. Instead, I want to add the Tailwind classes and rely on Discourse’s own preflight.

Not elegant, but it works for us. Use for your own inspiration. :slight_smile:

Best,
Andreas