The TailwindCSS getting started guide tells me to install itself using this command:
npm install -D tailwindcss@npm:@tailwindcss/postcss7-compat postcss@^7 autoprefixer@^9
Why can't I just do:
npm install -D tailwindcss postcss autoprefixer
I don't understand why the long npm install name, what the @ symbol does and if the first command is even different to the second command. If someone could point me in the right direction that would be greatly appreciated :)
This is the reason.
Create React App doesn’t support PostCSS 8 yet so you need to install the Tailwind CSS v2.0 PostCSS 7 compatibility build for now
What you are installing is a special compatibility build to work with CRA.
Regarding what @npm means see https://docs.npmjs.com/cli/v7/commands/npm-install#:~:text=is%20not%20valid.-,npm%20install%20%3Calias%3E%40npm%3A%3Cname%3E,-%3A
Install a package under a custom alias.
See https://www.npmjs.com/package/@tailwindcss/postcss7-compat. It is the package you are installing by the name tailwindcss