Как создать реагирующее приложение как сервис / пакет и импортировать его в «package.json» другого приложения

Question

.

Привет, сейчас я работаю в приложении monorepo в реаги.

Мне нужно извлечь некоторые из его «компонентов» и «стилизация» и создать отдельные модули / пакеты, которые находятся внеосновной проект и импортируйте их в package.json как обычные модули.

исходная структура файла и структура будущего предложения:

 myMainproject:
 
    \src
      \components
        component-styles.scss
        \button
        \label
        \list
        \item
        .......
      \modules
        \calendar
        \header
        \footer
        \support
      .....
      package.json
      ....
      
 
 // I extract calendar, footer modules 
 
 calendarService:
 
     \src
      \components
        component-styles.scss
        \button
        \label
        \list
        \item
        .......
      \modules
        \calendar
      .....
      package.json
      ....
      
      
 footerService:
 
     \src
      \components
        component-styles.scss
        \button
        \label
        \list
        \item
        .......
      \modules
        \footer
      .....
      package.json
      ....
      
 
 // Extract style and create a separate service
 
 styleService
      \src
        \styles
         .....
      package.json
      ....
      
      

final 'package.json' of 'myMainproject':

  ......
  "dependencies": {
      "calendarService": ...,
      "footerService": .... ,
      "styleService": ...,
      .....
  }

Есть ли у вас какие-либо идеи, не только технические, но и архитектурные, или какой-либо документ для достижения этой цели?

Answer 1

В соответствии с дизайном, для каждого из React Module (Календарь, нижний колонтитул и стиль), который вы хотите создать, вам также необходимо добавить файл index.js в структуру. Вы можете назвать файл как хотите. Это файл, который будет запущен, когда ваш модуль будет необходим.

Вам просто нужно будет экспортировать ваши компоненты из файла index.js. В файле package.json отдельных модулей React вам нужно будет указать файл JS, который вы хотите выполнить, когда этот модуль требуется или импортируется. Вы делаете это, предоставляя имя файла для поля main в package.json

Answer 2

Попробуйте использовать рабочие пространства пряжи, документы здесь