Setup Tailwind with PostCSS in Create-React-App in 5 Minutes

Featuring monolithic blocks of shell commands.

Installation

  1. Setup the initial directory.

2. Install the necessary packages.

Setup Configuration Files

3. Run this block of commands in your project directory from the terminal.

4. Replace the ‘scripts’ section in your package.json with the following.

package.json

3. Setup Some Boilerplate

Done! Tailwind should now be successfully installed.

At this point, npm start should output a simple ‘Hello World’ text:

Try running the app to see the result.

But if you want something a bit flashier, here’s a different App.js file to try:

App.js

The end result should look like this.

The completed repo can be found here:

Thanks for reading!

If you’re interested in more stuff that I’ve written, you can find them at https://grobel.dev/articles. Thanks for reading.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store