Migrating from Bootstrap to Tailwind CSS

Apologies for the misleading title—while I set out to document my migration from Bootstrap 5 to Tailwind CSS, this post ultimately highlights another case where ChatGPT falls short.

I started by asking ChatGPT for a step-by-step guide to migrate my project. As expected, it provided a seemingly straightforward plan:

# install tailwind
npm install -D tailwindcss postcss autoprefixer

# initialize tailwind
npx tailwindcss init -p

# configure the two files that were created
tailwind.config.js and postcss.config.js

# more steps to finilize the migration
(...)

However, I immediately hit a roadblock on step two — npx tailwindcss init -p threw an error:

npm ERR! could not determine executable to run.

Hoping for a quick fix, I pasted the error into ChatGPT, expecting a widely known solution. Instead, it repeatedly suggested checking if Tailwind was installed with yarn list --pattern tailwindcss (it was) and reinstalling it. No matter how I reworded my query, it kept giving me variations of the same unhelpful answer.

So, I took a different approach — I checked what npx tailwindcss init -p was supposed to generate and manually created the config files. That worked, and I was able to continue the migration.

ChatGPT is incredibly useful but still requires human intervention. It should have suggested alternative solutions, including manually creating the files. AI is powerful, but it’s not a replacement for problem-solving instincts.