Skip to content
| Marketplace
Sign in
Visual Studio Code>Formatters>Sort MembersNew to Visual Studio Code? Get it now.
Sort Members

Sort Members

MSRublev

|
6 installs
| (0) | Free
Сортирует члены TS/JS-классов и Angular-шаблонов: порядок полей, методов, инжектов, декораторов, импортов, отступов.
Installation
Launch VS Code Quick Open (Ctrl+P), paste the following command, and press enter.
Copied to clipboard
More Info

Sort Members

Инструмент, который физически приводит TS/JS-классы и Angular-шаблоны к единому стилю — не подсвечивает нарушение (как ESLint-правило @typescript-eslint/member-ordering), а сразу переставляет и правит код.

Существует в двух формах на одной и той же логике сортировки:

  • VS Code-расширение — сортировка прямо в редакторе: горячая клавиша, кнопка, контекстное меню, Format Document.
  • npm CLI (sort-members) — массовая сортировка всего проекта одной командой в терминале, без открытия файлов в редакторе (например, в CI или разовой миграцией).

Обе формы собираются из одного кода в этом репозитории и дают идентичный результат.

Установка

VS Code-расширение

Соберите .vsix и установите вручную:

npm install
npm run compile
npx vsce package        # получится sort-members-<версия>.vsix

Затем в VS Code: Extensions → ... (три точки вверху) → Install from VSIX... → выбрать собранный файл.

📖 Полная инструкция по расширению

npm CLI (sort-members)

npm install --save-dev sort-members

📖 Полная инструкция по CLI

Порядок по умолчанию

Категории идут сверху вниз:

  1. DI-инъекции — injected-field
  2. Input-поля — public-input-field → protected-input-field → private-input-field
  3. Output-поля — public-output-field → protected-output-field → private-output-field
  4. Static readonly поля — public-static-readonly-field → ...
  5. Static mutable поля — public-static-field → ...
  6. Сигналы состояния — signal() / computed() / effect()
  7. Instance readonly поля — public-instance-readonly-field → ...
  8. Instance mutable поля — public-instance-field → ...
  9. Конструктор — constructor
  10. Lifecycle hooks — ngOnChanges → ngOnInit → ngDoCheck → ngAfterContentInit → ... → ngOnDestroy
  11. Accessors — get → set
  12. Static-методы — public-static-method → ...
  13. Instance-методы — public-instance-method → ...

Полный список категорий: таблица в README-EXTENSION.md

Что ещё правит команда

  • Явный модификатор доступа (public/protected/private)
  • Пустые строки между членами класса
  • Группировка импортов (внешние → локальные)
  • Пустая строка между case в switch
  • JSDoc и комментарии переезжают со своим членом
  • // #region / // #endregion — сортировка внутри регионов

Все правки идемпотентны — повторный запуск ничего не меняет.

Настройка

Свой порядок

VS Code — memberOrdering.order в settings.json:

{
  "memberOrdering.order": [
    "injected-field",
    "constructor",
    "public-instance-method"
  ]
}

CLI — файл .sortmembersrc.json в корне проекта:

{
  "order": [
    "injected-field",
    "constructor",
    "public-instance-method"
  ]
}

Исключение файлов

VS Code — memberOrdering.ignore в settings.json:

{
  "memberOrdering.ignore": ["**/*.spec.ts", "**/*.e2e.ts"]
}

CLI — поле ignore в .sortmembersrc.json или флаг --ignore:

sort-members --ignore "**/*.e2e.ts" --ignore "legacy/**" src

Форматирование Angular-шаблонов (.html)

Команда Sort Members: Format Template приводит открывающие теги к единому виду:

  • Порядок атрибутов: *ngIf/*ngFor → #ref → id → class → [class.xxx] → bindings → (event)
  • Если атрибутов 2+ — каждый на своей строке

📖 Полная инструкция по расширению | 📖 Полная инструкция по CLI | 🛠 Документация разработчика

  • Contact us
  • Jobs
  • Privacy
  • Manage cookies
  • Terms of use
  • Trademarks
  • Your Privacy Choices
  • Consumer Health Privacy
© 2026 Microsoft