`@ apply` нельзя использовать с` `потому что` .` либо не может быть найдено ... Tailwind - PullRequest
0 голосов
/ 06 мая 2020

Я использую попутный ветер с laravel mix и post css. Я получаю сообщение об ошибке:

@apply нельзя использовать с .text-grey-default, потому что .text-grey-default либо не может быть найден, либо его фактическое определение включает псевдоселектор, например: hover,: active, et c . Если вы уверены, что .text-grey-default существует, убедитесь, что все операторы @import правильно обрабатываются до того, как Tailwind CSS увидит ваш CSS, поскольку @apply может использоваться только для классов в том же дереве CSS.

Я думал, что это потому, что он не находится в том же файле CSS, но я использую post css -import, чтобы преодолеть это. В теле тега нет псевдоселектора, и весь импорт находится в верхней части файла. Я действительно не могу понять, откуда эта проблема и как ее решить.

app.s css

@import "tailwindcss/base";
@import "tailwindcss/components";
@import "variables";
@import url("https://fonts.googleapis.com/css?family=Nunito");
@import "@fortawesome/fontawesome-free/css/all.min.css";

body {
    @apply text-grey-default;
}

webpack.mix . js

let mix = require("laravel-mix");
let tailwindcss = require("tailwindcss");
let atImport = require('postcss-import');

mix.js("resources/js/app.js", "public/js")
    .sass("resources/sass/app.scss", "public/css")
    .options({
        processCssUrls: false,
        postCss: [
            atImport(),
            tailwindcss("./tailwind.config.js"),
        ]
    })
    .version();

tailwind.config. js

let colors = {
    "grey-default": "#636b6f",

};

module.exports = {
    colors: colors,
    textColors: colors,  
    options: {
        prefix: "",
        important: false,
        separator: ":"
    }
};

1 Ответ

0 голосов
/ 08 мая 2020

Я понял свою ошибку. Я забыл указать цвета и цвета текста в теме: {} в моей конфигурации попутного ветра.

...