Почему не существует класса «border-border». Если «border-border» — это собственный класс, убедитесь, что он определен в ⇐ CSS
Почему не существует класса «border-border». Если «border-border» — это собственный класс, убедитесь, что он определен в
Ошибка вот в чем:
Класса `y-border-border` не существует. Если `y-border-border` является пользовательским классом, убедитесь, что он определен в директиве `@layer`. 1 | база @tailwind; | ^ 2 | компоненты @tailwind; 3 | утилиты @tailwind;
Я уже проверил сообщение на https://github.com/shadcn-ui/ui/issues/214. Класс `border-border` не существует. Если «border-border» — это собственный класс, убедитесь, что он определен в директиве «@layer», чтобы внести изменения в мой код.
Я работаю над проектом Laravel React с shadcn/ui. Я выбираю машинописный текст, когда php artisan Breeze:install, но обнаруживаю, что нет файла с именем tailwind.config.ts.
app.css:
база @tailwind; компоненты @tailwind; утилиты @tailwind; @layer base { :корень { --фон: 0 0% 100%; --передний план: 222,2 47,4% 11,2%; --без звука: 210 40% 96,1%; --muted-foreground: 215,4 16,3% 46,9%; --popover: 0 0% 100%; --popover-foreground: 222,2 47,4% 11,2%; --граница: 214,3 31,8% 91,4%; --вход: 214,3 31,8% 91,4%; --карта: 0 0% 100%; --card-foreground: 222,2 47,4% 11,2%; --первичный: 222,2 47,4% 11,2%; --первичный-передний план: 210 40% 98%; --среднее: 210 40% 96,1%; --вторичный-передний план: 222,2 47,4% 11,2%; --акцент: 210 40% 96,1%; --accent-foreground: 222,2 47,4% 11,2%; --разрушительный: 0 100% 50%; --destructive-foreground: 210 40% 98%; --кольцо: 215 20,2% 65,1%; --радиус: 0,5 бэр; } .темный { --фон: 224 71% 4%; --передний план: 213 31% 91%; --без звука: 223 47% 11%; --muted-foreground: 215,4 16,3% 56,9%; --акцент: 216 34% 17%; --accent-foreground: 210 40% 98%; --popover: 224 71% 4%; --popover-foreground: 215 20,2% 65,1%; --граница: 216 34% 17%; --ввод: 216 34% 17%; --card: 224 71% 4%; --card-foreground: 213 31% 91%; --первичный: 210 40% 98%; --первичный-передний план: 222,2 47,4% 1,2%; --среднее: 222,2 47,4% 11,2%; --вторичный-передний план: 210 40% 98%; --разрушительный: 0 63% 31%; --destructive-foreground: 210 40% 98%; --кольцо: 216 34% 17%; --радиус: 0,5 бэр; } } @layer base { * { @apply y-border-border; } тело { @apply y-bg-background y-text-foreground; настройки шрифта-функции: «rlig» 1, «calt» 1; } } tailwind.config.js:
/** @type {import('tailwindcss').Config} */ модуль.экспорт = { darkMode: ["класс"], содержание: [ "./pages/**/*.{ts,tsx}", "./comComponents/**/*.{ts,tsx}", "./app/**/*.{ts,tsx}", "./src/**/*.{ts,tsx}", ], префикс: "й", тема: { контейнер: { центр: правда, отступ: "2рем", экраны: { "2xl": "1400 пикселей", }, }, продлевать: { ключевые кадры: { "гармошка вниз": { от: { высота: "0" }, to: { height: "var(--radix-accordion-content-height)" }, }, "гармошка": { from: { height: "var(--radix-accordion-content-height)" }, до: { высота: "0" }, }, }, анимация: { "accordion-down": "аккордеон вниз, замедление 0,2 с", "accordion-up": "аккордеон вверх, замедление 0,2 с", }, }, }, плагины: [require("tailwindcss-animate")], }; Кто-нибудь может помочь? Я надеюсь, что смогу определить свой пользовательский интерфейс, используя префикс CSS Tailwind. Спасибо вам огромное~!!!
Ошибка вот в чем:
Класса `y-border-border` не существует. Если `y-border-border` является пользовательским классом, убедитесь, что он определен в директиве `@layer`. 1 | база @tailwind; | ^ 2 | компоненты @tailwind; 3 | утилиты @tailwind;
Я уже проверил сообщение на https://github.com/shadcn-ui/ui/issues/214. Класс `border-border` не существует. Если «border-border» — это собственный класс, убедитесь, что он определен в директиве «@layer», чтобы внести изменения в мой код.
Я работаю над проектом Laravel React с shadcn/ui. Я выбираю машинописный текст, когда php artisan Breeze:install, но обнаруживаю, что нет файла с именем tailwind.config.ts.
app.css:
база @tailwind; компоненты @tailwind; утилиты @tailwind; @layer base { :корень { --фон: 0 0% 100%; --передний план: 222,2 47,4% 11,2%; --без звука: 210 40% 96,1%; --muted-foreground: 215,4 16,3% 46,9%; --popover: 0 0% 100%; --popover-foreground: 222,2 47,4% 11,2%; --граница: 214,3 31,8% 91,4%; --вход: 214,3 31,8% 91,4%; --карта: 0 0% 100%; --card-foreground: 222,2 47,4% 11,2%; --первичный: 222,2 47,4% 11,2%; --первичный-передний план: 210 40% 98%; --среднее: 210 40% 96,1%; --вторичный-передний план: 222,2 47,4% 11,2%; --акцент: 210 40% 96,1%; --accent-foreground: 222,2 47,4% 11,2%; --разрушительный: 0 100% 50%; --destructive-foreground: 210 40% 98%; --кольцо: 215 20,2% 65,1%; --радиус: 0,5 бэр; } .темный { --фон: 224 71% 4%; --передний план: 213 31% 91%; --без звука: 223 47% 11%; --muted-foreground: 215,4 16,3% 56,9%; --акцент: 216 34% 17%; --accent-foreground: 210 40% 98%; --popover: 224 71% 4%; --popover-foreground: 215 20,2% 65,1%; --граница: 216 34% 17%; --ввод: 216 34% 17%; --card: 224 71% 4%; --card-foreground: 213 31% 91%; --первичный: 210 40% 98%; --первичный-передний план: 222,2 47,4% 1,2%; --среднее: 222,2 47,4% 11,2%; --вторичный-передний план: 210 40% 98%; --разрушительный: 0 63% 31%; --destructive-foreground: 210 40% 98%; --кольцо: 216 34% 17%; --радиус: 0,5 бэр; } } @layer base { * { @apply y-border-border; } тело { @apply y-bg-background y-text-foreground; настройки шрифта-функции: «rlig» 1, «calt» 1; } } tailwind.config.js:
/** @type {import('tailwindcss').Config} */ модуль.экспорт = { darkMode: ["класс"], содержание: [ "./pages/**/*.{ts,tsx}", "./comComponents/**/*.{ts,tsx}", "./app/**/*.{ts,tsx}", "./src/**/*.{ts,tsx}", ], префикс: "й", тема: { контейнер: { центр: правда, отступ: "2рем", экраны: { "2xl": "1400 пикселей", }, }, продлевать: { ключевые кадры: { "гармошка вниз": { от: { высота: "0" }, to: { height: "var(--radix-accordion-content-height)" }, }, "гармошка": { from: { height: "var(--radix-accordion-content-height)" }, до: { высота: "0" }, }, }, анимация: { "accordion-down": "аккордеон вниз, замедление 0,2 с", "accordion-up": "аккордеон вверх, замедление 0,2 с", }, }, }, плагины: [require("tailwindcss-animate")], }; Кто-нибудь может помочь? Я надеюсь, что смогу определить свой пользовательский интерфейс, используя префикс CSS Tailwind. Спасибо вам огромное~!!!
-
- Похожие темы
- Ответы
- Просмотры
- Последнее сообщение