CSS works locally but not in Vercel deployment
Answered
Lakeland Terrier posted this in #help-forum
Lakeland TerrierOP
When I deploy the app locally, the css loads/works as intended. When I deploy to vercel the CSS is seemingly not loading. I have double checked the tailwind.config.js. Where else should I be looking? Thank you for any ideas.
Answered by riský
i also cant seem to find
@nextui-org/theme in your package.json and id kinda expect it after looking through nextui docs (fwiw i havent ever used them)... so maybe try adding that56 Replies
Netherland Dwarf
Do you see an error on the console
Or on vercel
One way to verify is to run npm run build followed by npm start
As local dev does not reflect production
Tailwind can fail if there is some other external error
Lakeland TerrierOP
I do not see an error on the console
@Lakeland Terrier can you show screenshot of what you expected locally as for me there is some stylings present but i cant tell what ones are broken
like
mb-6 made it in there (so maybe its the nextui thats not being used correctly)i also cant seem to find
@nextui-org/theme in your package.json and id kinda expect it after looking through nextui docs (fwiw i havent ever used them)... so maybe try adding thatAnswer
and at a minum can you choose to use pnpm
package-lock.json or npm package-lock.json (you have both lock files which may be confusing vercel on what deps to install)Lakeland TerrierOP
I agree, it appears to be nextui that is breaking.
This is the local deployment
Lakeland TerrierOP
@riský Let me know if there is any other info I can get you
in your build script in vercel, can you run
ls ./node_modules/@nextui-org/theme/dist && npm build to ensure it is installed (put whatever your pkg manager to run build after listing files)@riský in your build script in vercel, can you run `ls ./node_modules/@nextui-org/theme/dist && npm build` to ensure it is installed (put whatever your pkg manager to run build after listing files)
Lakeland TerrierOP
Add that here in package.json? or here in vercel ?
in vercel to simplify it
(you may need to manually triger rebuild in latest deployment, but id say its better then actually commiting)
ye sounds good
Lakeland TerrierOP
redeploying
it will prob be sad as prisma isnt generated, but i more am trying to see the output of ls
Lakeland TerrierOP
view full logs and see what it said above
@Lakeland Terrier what did it say (like click "expand")
Lakeland TerrierOP
So nextui isnt installed on the deployment
uh hh
can you change it to just
ls (maybe its in the wrong folder and no node_modules right there and this will show other contents)Lakeland TerrierOP
kk
maybe also show ls of also nodemodules too
if it really isnt there, try to manually add the
@nextui-org/theme package to package.jsonand if still broken.. idk what to say
Lakeland TerrierOP
ok trying now one sec
i was meaning
ls && ls ./node_modules (and remove next build as its erroring with no prisma)Lakeland TerrierOP
ok
ok good so far
Lakeland TerrierOP
So nextui-org is def in the ./node_modules
yeah so the package just refuses to exist
so i say manually install it with npm/pnpm
Lakeland TerrierOP
pnpm install @nextui-org/theme/dist
or something else
without the /dist
Lakeland TerrierOP
kk
that was me just trying to copy what your tailwind had
Lakeland TerrierOP
ok thank you so much trying this
yeah np, met me know if this funally works (and dont forget to unto vercel build changes)
Lakeland TerrierOP
OMG THANK YHOU SO MUCh
IT WORKS YOU ARE A HERO
THANK YOU SO MUCH
Thank you for teaching my some trouble shooting methods and ultimately solving my problem. For clarity I needed to install the theme's folder manually
yayyyy
i normally go overboard with trouble shooting, but it can be fun to learn new things!
(im glad i could help even tho i havent ever used nextui)
Lakeland TerrierOP
Thank you so much my hero. You taught me a new skill