bridgetownrb / tailwindcss-automation

Automation for installing TailwindCSS in Bridgetown sites

tailwindcss-automation

An automation for installing TailwindCSS in a Bridgetown site.

In your Bridgetown project folder, run:

bin/bridgetown apply https://github.com/bridgetownrb/tailwindcss-automation

(Note: it will overwrite any existing postcss.config.js file in your repo.)

You can also apply the automation when creating a new site:

bridgetown new mysite --apply=https://github.com/bridgetownrb/tailwindcss-automation

The automation will add Tailwind to your package.json, set up a default Tailwind config, add the import statements to your frontend CSS entrypoint, and add a builder which will detect when content in src is modified and trigger Tailwind's JIT compiler to run.

Any questions? Check out the Bridgetown community discussion channels for help.

---

Future Compatibility Message

The Tailwind automation used to be a configuration option bundled with Bridgetown, but it has since been extracted to this community-maintained repository. I (@jaredcwhite) do not use or endorse Tailwind, but I'm happy to accept PRs to keep the automation working in case a future version of Tailwind breaks the script in some way. Thanks!

tailwindcss-automation's Issues

How do I use `@tailwindcss/typography`?

Hi. Tried to add it to package.json and postcss.config.js but class="prose" did nothing.

diff --git a/package.json b/package.json
index cd100f4..1ef612a 100644
--- a/package.json
+++ b/package.json
@@ -20,6 +20,7 @@
   },
   "dependencies": {
+    "@tailwindcss/typography": "^0.5.10",
   }
 }

and

diff --git a/postcss.config.js b/postcss.config.js
index bd5099c..617c814 100644
--- a/postcss.config.js
+++ b/postcss.config.js
@@ -1,10 +1,15 @@
 module.exports = {
   plugins: {
-    'tailwindcss': {},
+    "tailwindcss": {
+      plugins: [
+        require("@tailwindcss/typography"),
+        // ...
+      ],
+    },
   "postcss-flexbugs-fixes": {},
   "postcss-preset-env": {
       autoprefixer: {
       flexbox: 'no-2009'
       flexbox: "no-2009"
       },
       stage: 2
     }