Глобальный контекст для побитового компонента React

Я разрабатываю библиотеку компонентов React для веб-сайта. Для локальной разработки я использую Storybook. я думаюbitможет быть хорошим инструментом (лучше, чем ссылка npm) для экспорта компонентов библиотеки и импорта их в репозиторий веб-сайта. Теперь проблема в том, что я использую глобальный контекст для некоторых компонентов, но битовые компоненты должны быть изолированными и самодостаточными. Я не хочу оборачивать все мои крошечные компоненты, которые используют глобальный контекст только для их рендеринга в https://bit.dev/!

Мне удалось решить ту же проблему со сборником рассказов с помощью декораторов. Итак, я определяю компонент, не оборачивая егоContextProvider а затем в файле историй я использую декоратор, который обертывает мой компонент ContextProvider.

Есть ли способ обернуть битовые компоненты с помощью глобального поставщика контекста без упаковки фактического компонента, который будет использоваться на рабочем веб-сайте, где один глобальный поставщик контекста обертывает все приложение? А как насчет лучших практик такого рода рабочего процесса?

1 ответ

Использование глобального контекста при реализации повторно используемых компонентов не рекомендуется.
Не только при использовании Bit, но и когда другой проект использует компонент, он должен иметь тот же точный контекст для работы компонента. Делает компонент менее пригодным для повторного использования и привлекательным для потребителей.
Тот факт, что это неудобно для рендеринга примеров на игровой площадке в bit.dev, является для этого побочным эффектом.
Что вы можете сделать, так это отделить состояние от компонента и использовать параметры для получения состояния и действий напрямую через API. Или вы можете инкапсулировать состояние внутри компонента. Вы можете узнать больше об этом в лучших практиках Bit по созданию повторно используемых компонентов - https://docs.bit.dev/docs/best-practices,
а также здесь - https://github.com/Tallyb/reusable-components-styleguide

Другие вопросы по тегам