Миграция на Composition API не обязана быть big-bang переписыванием. Вот план, по которому мы перевели проект на 40k строк за полтора месяца без заморозки фич.

Шаг 1 — новые компоненты сразу на Composition API

Options API и <script setup> прекрасно живут в одном проекте. Правило: всё новое — сразу в новом стиле.

Шаг 2 — выносим переиспользуемую логику в composables

Миксины конвертируются в composables почти механически: data() > ref/reactive, methods > обычные функции, computed остаётся computed.

Шаг 3 — Pinia вместо Vuex

Если ещё сидите на Vuex — переезд на Pinia стоит делать параллельно, это существенно упрощает типизацию store.

Шаг 4 — мигрируем "горячие" компоненты последними

Компоненты с самой сложной бизнес-логикой трогайте в последнюю очередь, когда команда уже набила руку на простых случаях.

Частые грабли

  • Забытый .value в script вне шаблона
  • Потеря реактивности при деструктуризации reactive-объекта без toRefs
  • Watchers, зависящие от порядка объявления refs