Tailwindcss not applying in react project
Good morning
I am working on a react project using vite.
but suddendly my tailwind styles stopped applying, i've tried everything i could but i couldn't still resolve it
6 Replies
okay, that sounds bad
what's in your package.json? any errors? any messages in the console? and in the browser? are you relying on some automatic browser sync or some other hot patching? what were you trying to do? what do you have so far?
no message in the console, no error showing on the screen
{
"name": "codebylizabeth",
"displayName": "CodeByLizabeth",
"private": true,
"version": "0.0.0",
"type": "module",
"scripts": {
"dev": "vite",
"build": "vite build",
"lint": "eslint .",
"preview": "vite preview"
},
"dependencies": {
"@tailwindcss/vite": "^4.1.6",
"react": "^19.0.0",
"react-dom": "^19.0.0"
},
"devDependencies": {
"@eslint/js": "^9.22.0",
"@types/react": "^19.0.10",
"@types/react-dom": "^19.0.4",
"@vitejs/plugin-react": "^4.3.4",
"autoprefixer": "^10.4.21",
"eslint": "^9.22.0",
"eslint-plugin-react-hooks": "^5.2.0",
"eslint-plugin-react-refresh": "^0.4.19",
"globals": "^16.0.0",
"parcel": "^2.15.0",
"postcss": "^8.5.3",
"tailwindcss": "^4.1.6",
"vite": "^6.3.1"
}
}
thats my pacakge.json
i'm trying to build a portfolio for my projects
i've sketched up all the component i need with basics tailwind styles, which automatically gone off now
this is what i have on my screen, all styles gone
and what's in the network tab of the browser tools?