\n\n\n```\n\nOptions API:\n\n```js\nimport UserCard from './UserCard.vue'\n\nexport default {\n components: { UserCard },\n}\n```\n\n## Почему это важно\n\n1. Неиспользуемый компонент не тянется в граф, если его не импортируют (при нормальном code-splitting).\n2. Ревью и рефакторинг проще: видно, кто от кого зависит.\n3. Имена не засоряют глобальное пространство приложения.\n4. Локальные регистрации **не наследуются** детьми — каждому уровню свои imports / `components`.\n\nГлобальная регистрация «на всякий случай» часто тащит мёртвый код и скрывает связи.\n\n## Итог\nLocal registration — дефолт Vue 3 + SFC. Global — осознанное исключение для base-слоя или legacy."}}}

Зачем нужна локальная регистрация компонентов?

Vue · junior · сложность 2

Войти, чтобы отмечать

Ключевая идея

Локальная регистрация подключает компонент только там, где он реально используется. Зависимости явны, бандл обычно меньше, чем при глобальном «зарегистрировать всё».

Как выглядит

<script setup>
import UserCard from './UserCard.vue'
// в <script setup> импорта достаточно для использования в template
</script>

<template>
  <UserCard :user="user" />
</template>

Options API:

import UserCard from './UserCard.vue'

export default {
  components: { UserCard },
}

Почему это важно

Неиспользуемый компонент не тянется в граф, если его не импортируют (при нормальном code-splitting).
Ревью и рефакторинг проще: видно, кто от кого зависит.
Имена не засоряют глобальное пространство приложения.
Локальные регистрации не наследуются детьми — каждому уровню свои imports / components.

Глобальная регистрация «на всякий случай» часто тащит мёртвый код и скрывает связи.

Итог

Local registration — дефолт Vue 3 + SFC. Global — осознанное исключение для base-слоя или legacy.

Загрузка…