Я пытаюсь загрузить базовый проект nuxt.js с помощью tailwind.css 2.0. Я использовал :

пряжа add --dev tailwindcss @ npm: @ tailwindcss / postcss7-compat postcss @ ^ 7 autoprefixer @ ^ 9

Установить tailwindcss 2.0

Сначала я использовал npm, затем yarn, но при развертывании tailwind css 2.0 не работает. На локальном он отлично работает.

Спасибо за ответы

0
Nab 12 Фев 2021 в 19:38

1 ответ

Лучший ответ

Я не могу сказать без дополнительных подробностей, но если вы столкнулись с трудностями в производстве, но не в разработке проекта tailwindcss - первое, что нужно проверить, это то, используете ли вы имена динамических классов (например, text-${color}-500) . Эти будут очищены в рабочей среде, если вы не добавите их в список разрешений.

ОБНОВЛЕНИЕ

Взглянув на репозиторий, который вы предоставили, похоже, что проблема в том, что Tailwind генерирует таргетинг CSS [type='text'], но он очищается html-minifier в сгенерированном HTML-коде вашего приложения Nuxt (см. проблема ). Вы можете отключить это поведение с помощью этого кода в вашем nuxt.config:

export default {
  build: {
    html: {
      minify: {
        collapseBooleanAttributes: true,
        decodeEntities: true,
        minifyCSS: true,
        minifyJS: true,
        processConditionalComments: true,
        removeEmptyAttributes: true,
        // this is the only line we're changing from defaults
        // but we have to include all as they aren't merged
        removeRedundantAttributes: false,
        trimCustomFragments: true,
        useShortDoctype: true
      }
    }
  }
}
1
Daniel Roe 14 Фев 2021 в 23:25