Add Tailwind CSS to a CodeIgniter 4 Project

I had a few problems installing tailwindcss but found this to work.

npm install -D tailwindcss

npx tailwindcss init

Update tailwind.config.js as below:

Code:
/** @type {import('tailwindcss').Config} */

module.exports = {

content: ["./app/Views/**/*.php"],

theme: {

extend: {},

},

plugins: [],

}

Create the input.css with the usual entries. I created it in app/Views/css/input.css

@tailwind base;

@tailwind components;

@tailwind utilities;

In the terminal cd to the CodeIgniter install folder and run this command.

npx tailwindcss -i ./app/Views/css/input.css -o ./public/assets/css/styles.css --watch

Now you just need to include the style.css file. It will be automatically updated if there are any changes in your ./app/Views folder.

With thanks to encodedigital on the Codeigniter Forum. Who gave the clearest instructions that worked for me.