Найти тему

Что такое re-export компонентов и как он работает?


Все так или иначе используют import и export в ReactJS. Это мощные инструменты по «дроблению» большого файла на небольшие компоненты. Работать с несколькими небольшими компонентами проще чем с одним огромным файлом на несколько тысяч строк. Но в таком подходе также есть минус — это длинные пути для импорта.

Например, импорт компонента может выглядеть так:

import { Button } from ''./components/custom/common/buttons/Button.tsx''

Для решения этой проблемы используют re-export компонентов. Основная идея в том что на каждом уровне вложенности у нас есть файл index.ts, через который проходит весь экспорт. Иаким образом пути максимально сокращаются:

import { Button } from ''./components''

Что такое re-export компонентов и как он работает?  Все так или иначе используют import и export в ReactJS. Это мощные инструменты по «дроблению» большого файла на небольшие компоненты.
Около минуты