Next.js Discord

Discord Forum

Small question regarding tailwind

Unanswered
Philippine Crocodile posted this in #help-forum
Open in Discord
Philippine CrocodileOP
I'm starting the dashboard tutorial from the Next.JS website and have a question regarding tailwind.

In the global.css file the top 3 tailwind rules are underlined in yellow and say "unknown at rule @tailwind".

I believe tailwind is working because when I imported the global.css file into the root layout.tsx file the page reflected the styling changes, but I'm curious why VS Code is giving me a yellow underline.

I ran "npm i" 2 or 3 times to make sure everything is installed. Tailwindcss exists in the Package.json, but another strange thing related to this is that when I run "tailwindcss -v" in my terminal I get "zsh: command not found: tailwindcss".

Sorry for the noob question but I just want to make sure I'm doing things the proper way.

Thanks!

16 Replies

Philippine CrocodileOP
So there's nothing I can do to fix it? Damn, it's really messing with my OCD lol.
!=tgt
there is
hold on
{
    "version": 1.1,
    "atDirectives": [
        {
            "name": "@tailwind",
            "description": "Use the @tailwind directive to insert Tailwind's `base`, `components`, `utilities`, and `screens` styles into your CSS."
        },
        {
            "name": "@apply",
            "description": "Use the @apply directive to apply existing classes to an element."
        }
    ]
}

this file goes in (project root)/.vscode/css_custom_data.json
Philippine CrocodileOP
I don't seem to have a .vscode directory. Hmm, oh well I'm just going to try to ignore it lol.
Thank you!
and then put it in there
Philippine CrocodileOP
Oh, okay I get what you're saying. Cool.
!=tgt
and then in vscode settings, you can put the path, like this
Philippine CrocodileOP
That all seems a bit beyond my understanding for now. Thanks for the tip! I'll just try to ignore it for now.
copypaste it there
"css.customData": [
  ".vscode/css_custom_data.json"
],

and put that somewhere in your settings.json