Классы CSS Taillid ⇐ CSS

[Anonymous]

Я использую последнюю версию Next.js с турбопаком и пытаюсь настроить Tailwind CSS, но это не применяется вообще. Нет ошибок во время компиляции, но браузер просто видит непрерывно html.

Код: Выделить всё

const config = {
plugins: ["@tailwindcss/postcss"],
};

export default config;
< /code>
package.json:
{
"name": "somm",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev --turbopack",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"react": "^19.0.0",
"react-dom": "^19.0.0",
"next": "15.3.0"
},
"devDependencies": {
"typescript": "^5",
"@types/node": "^20",
"@types/react": "^19",
"@types/react-dom": "^19",
"@tailwindcss/postcss": "^4",
"tailwindcss": "^4"
}
}

App/globals.css:

Код: Выделить всё

@import "tailwindcss";

:root {
--background: #ffffff;
--foreground: #171717;
}

@theme inline {
--color-background: var(--background);
--color-foreground: var(--foreground);
--font-sans: var(--font-geist-sans);
--font-mono: var(--font-geist-mono);
}

@media (prefers-color-scheme: dark) {
:root {
--background: #0a0a0a;
--foreground: #ededed;
}
}

body {
background: var(--background);
color: var(--foreground);
font-family: Arial, Helvetica, sans-serif;
}
< /code>
App/layout.tsx включает в себя:
import './globals.css' 

Я попытался настроить Tailwind CSS в новом приложении Next.js, используя каталог приложений по умолчанию и турбопак. Я выполнил официальные этапы установки Tailwind, импортированные @tailwindcss/postcss в postcss.config.js, и добавил директивы Tailwind в мои глобалы. Тем не менее, они не имеют никакого эффекта - мое приложение отображается как простые HTML без применения стиля для ветра. Я подозреваю, что Tailwind не поднимается должным образом, но я не уверен, является ли это проблемой с турбопаком, моей конфигурацией или попутным ветром 4.

Подробнее здесь: https://stackoverflow.com/questions/795 ... -turbopack