Как SCSS-плагин сломал форматирование TypeScript

1. Ошибка до сортировки SCSS

В .prettierrc сайта подключён prettier-grundy-scss-order, но grundyScssSorterGroupsOrder явно не задан. Prettier нормализует опции загруженного плагина и при обработке TypeScript или JSON. Поэтому неверный default останавливает команду ещё до сортировки стилей. Запуск без конфигурации помог локализовать источник, но одновременно отключал настройки проекта: это временный диагностический обход, а не решение.

{ "plugins": ["prettier-grundy-scss-order"] }

2. Значение в конфигурации — не описание опции

В старом коде опция объявлялась как массив строк, а её default был обычным массивом имён групп. В схеме опций плагина Prettier массивное значение по умолчанию требует обёртки value. Обычный массив в пользовательской конфигурации сам по себе ошибкой не был. Менять синтаксис TypeScript или устанавливать Sass для исправления этой валидации не требовалось.

grundyScssSorterGroupsOrder: {
  type: "string",
  array: true,
  default: ["@use", "@extend", "--variable", "$variable", "@if",
    "decl", "@include", "@mixin", "rule"]
}

3. Исправляем default и выбор порядка

Исправление задаёт default: [{ value: [] }]. В парсере пустой массив означает: взять порядок выбранного пресета, а при его отсутствии — встроенный. Проверки только на null или undefined недостаточно: пустой массив иначе перекроет запасное значение. Непустой пользовательский порядок по-прежнему имеет приоритет. Обёртка value нужна в исходнике плагина, а не в .prettierrc пользователя.

grundyScssSorterGroupsOrder: {
  type: "string",
  array: true,
  default: [{ value: [] }]
}

// Resolve the actual order inside the parser:
const order = grundyScssSorterGroupsOrder?.length
  ? grundyScssSorterGroupsOrder
  : (preset?.order ?? defaultPreset.order);

4. Проверяем реальный CLI

Тест сортировки сам по себе не проверяет загрузку и нормализацию опций через CLI. Добавленный регрессионный тест запускает локальный исполняемый файл Prettier для package.json с конфигурацией репозитория, без явно заданного порядка групп. Он проверяет успешный результат форматирования. В наборе плагина 30 тестов; новый тест отдельно защищает обработку файлов, которые вообще не являются SCSS.

const { stdout } = await execFileAsync(process.execPath,
  [prettierCli, "--check", "package.json"],
  { cwd: rootDirectory });
assert.match(stdout, /All matched files use Prettier code style/);

5. Обновляем проект, который использует плагин

После обновления пакета и lockfile запускаем обычную команду с конфигурацией на реальном файле или каталоге исходников. В примере замените src на свой каталог. На сайте проверка TypeScript теперь проходит с включённым плагином и без явного порядка групп. Предупреждения о неотформатированных файлах — отдельная проблема: они означают различия оформления, а не исходную ошибку валидации опции.

npm install prettier-grundy-scss-order@^0.2.3
npm ls prettier prettier-grundy-scss-order
npx prettier --check "src/**/*.{ts,tsx}"

6. Границы исправления

Этот разбор касается default массивной опции, а не всех проблем форматирования CSS. В 0.2.3 также изменено значение по умолчанию для сортировки корневых узлов и внесены другие правки сортировщика: после обновления нужно просмотреть diff стилей. Выбор парсера, исключённые файлы и влияние перестановок на каскад проверяются отдельно. Тесты алгоритма и CLI-регрессия дополняют друг друга: они проверяют разные границы системы.