10:04:32 PM [vite] Internal server error: [postcss] It looks like you're trying to use tailwindcss directly as a PostCSS plugin. The PostCSS plugin has moved to a separate package, so to continue using Tailwind CSS with PostCSS you'll need to install @tailwindcss/postcss > and update your PostCSS configuration. Plugin: vite:css File: ...
10:04:32 PM [vite] Internal server error: [postcss] Missing > "./components" specifier in "tailwindcss" package Plugin: vite:css File: ...
I developed my chat app so I wanted everything updated so I removed node_modules then npm install and build then the above error keeps coming. It has to be something related to dependencies because it was working before I remove node_modules.
npm cache clean --force
npm install -D tailwindcss autoprefixer postcss
I uninstalled them and did the above commands but it keeps giving me above error. What is the relation of PostCSS to TailwindCSS why are both dependent on each other?
npx tailwindcss init
also it says
npm error could not determine executable to run npm error A complete log of this run can be found in: /home/amosmurmu/.npm/_logs/2025-01-23T15_39_50_870Z-debug-0.log
I also tried to change Node.js version using NVM but it gives structured clone error so its not Node.js or NPX or NPM.
10:04:32 PM [vite] Internal server error: [postcss] It looks like you're trying to use tailwindcss directly as a PostCSS plugin. The PostCSS plugin has moved to a separate package, so to continue using Tailwind CSS with PostCSS you'll need to install @tailwindcss/postcss > and update your PostCSS configuration. Plugin: vite:css File: ...
10:04:32 PM [vite] Internal server error: [postcss] Missing > "./components" specifier in "tailwindcss" package Plugin: vite:css File: ...
I developed my chat app so I wanted everything updated so I removed node_modules then npm install and build then the above error keeps coming. It has to be something related to dependencies because it was working before I remove node_modules.
npm cache clean --force
npm install -D tailwindcss autoprefixer postcss
I uninstalled them and did the above commands but it keeps giving me above error. What is the relation of PostCSS to TailwindCSS why are both dependent on each other?
npx tailwindcss init
also it says
npm error could not determine executable to run npm error A complete log of this run can be found in: /home/amosmurmu/.npm/_logs/2025-01-23T15_39_50_870Z-debug-0.log
I also tried to change Node.js version using NVM but it gives structured clone error so its not Node.js or NPX or NPM.
The installation of TailwindCSS v3 and v4 is different. You were expecting the v3 installation, but v4 is the new latest version. For v3 installation, use:
npm install -D tailwindcss@3
Once this is done, the other steps remain unchanged:
To install TailwindCSS v4, please refer to the updated installation and upgrade guides.
Some related question for v4 upgrade:
I see you're using v4. The use of tailwind.config.js has been removed, and instead, you can use a simple CSS-first configuration. However, it's possible to use the legacy JavaScript-based configuration via the @config directive.
Delete the postcss.config.js file
And then npm i -d @tailwindcss/vite,
and also change the vite.config.ts file
...
import tailwindcss from "@tailwindcss/vite";
export default defineConfig(async () => ({
plugins: [
react(),
tailwindcss(),
],
...
...
then add @import "tailwindcss"; in your css file
npm install tailwindcss@3to use v3. To migrate to v4, read the update guide in the documentation. The v4 was released a few days ago, so npm install tailwindcss now automatically installs v4 instead of v3. However, for this, you should no longer use the default Vite plugin, PostCSS and Autoprefixer:npm install tailwindcss @tailwindcss/vite- TailwindCSS v4 with Vite; TailwindCSS v4 with PostCSS – rozsazoltan Commented Jan 24 at 8:43