Как подключить stylus в nuxt?

В Nuxt.js вы можете легко подключить Stylus в свой проект, следуя нескольким простым шагам.

1. Установка пакета stylus и плагина stylus-loader:
Выполните следующую команду в командной строке:

   npm install stylus stylus-loader --save-dev

2. Настройка конфигурации:
Откройте файл nuxt.config.js в корневой папке вашего проекта. Добавьте следующий код в раздел build:

   build: {
     extend(config, ctx) {
       if (ctx.isDev && ctx.isClient) {
         config.module.rules.push({
           test: /.styl(us)?$/,
           loader: 'stylus-loader',
           options: {
             /* ваше конфигурационные опции для stylus-loader здесь */
           }
         });
       }
     }
   }

3. Создание файла стилей:
Создайте файл app.styl в папке assets вашего проекта.

4. Использование стилей:
Вы можете использовать созданный файл стилей в ваших компонентах или страницах, прописав его в соответствующем блоке стилей. Например:

   <style lang="stylus" scoped>
   /* импорт файла */
   @import '~@/assets/app.styl';

   /* ваши стили здесь */

   </style>

Теперь, когда вы сохранили изменения, Nuxt.js подключит и обработает файлы Stylus в вашем проекте. Убедитесь, что вы перезапустили сервер разработки для применения изменений.

Надеюсь, это поможет вам успешно настроить подключение Stylus в Nuxt.js!