Развертывание пакета react (или любого другого JavaScript) в npm довольно просто, различия между двумя соответствующими системами модулей JavaScript, ESM (модули «ECMAScript) и Cjs (CommonJs), могут сделать его немного сложным.
Очевидно, что с Cjs вы не можете легко требовать ESM в основном из-за реализации ESM на верхнем уровне await, однако в контексте ESM модуль Cjs можно импортировать с минимальными хлопотами.
Если публикуемый пакет написан на ESM и его предполагается использовать в контексте проекта ESM, то беспокоиться не о чем. Мы сталкиваемся с проблемами, когда наш опубликованный пакет ESM требуется в Cjs.
Чтобы обойти это, мы можем написать наш пакет в ESM и использовать упаковщик для переноса его в Cjs с необязательным именованным экспортом. Таким образом, мы получаем лучшее из обоих миров и делаем наш пакет безопасным для использования с любой из двух модульных систем. Я проиллюстрирую этот процесс с помощью свернутого бандлера.
Допустим, мы хотим опубликовать приведенный ниже модуль, экспортированный с помощью ESM;
Нам нужно настроить накопительный пакет для работы с нашим проектом, ниже приведена конфигурация накопительного пакета с плагином (rollup-plugin-typescript2), который объединяет файлы машинописного текста.
Имея эти настройки, мы можем запустить команду rollup -c, чтобы связать пакет. Будет создана папка dist с файлом index.js, содержащим cjs транспайл нашего пакета.
Скомпилированный файл выглядит так.
Я собрал здесь репозиторий, чтобы вы могли быстро приступить к работе. Спасибо за прочтение.
