NPM Workspaces monorepo - общий доступ к папке распространения локального пакета как root, а не ко всем исходным файлам

Question

Используя рабочие области NPM, я делюсь одним пакетом () с другими (и). Что-то вроде этого:

      root
  apps   
    webapp1
    webapp2
  packages
    components

Все работает хорошо, но все внутри, включая исходный код в srcпапка находится в общем доступе. Поскольку скомпилированная выходная папка есть, я хотел бы предоставить общий доступ только к этой папке. Вот так это выглядит в корне node_modules:

Проблема в том, что когда мне нужно импортировать webappили мой путь импорта должен включать папку. Вот intellisense, который я получил от VS Code:

И вот как я импортирую в webapp1 и webapp2:

      import Center from '@mycompany/components/dist/Center'

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

Я пробовал файлы NPM и .npmignoreвнутри папки, чтобы игнорировать все, кроме папки, но, похоже, это не работает. В main свойство в package.json для components также указывает на:

      "main": "dist/index.js"

Интересно, что если я хочу импортировать файл, я могу обойтись без:

      import foo from '@mycompany/components'

... однако импорт чего-либо, кроме dist/index.js файлы требует dist быть включенным в путь.

Answer 1

Вы должны рассматривать папку пакетов как набор папок dist в вашем случае использования.

В этом сценарии вы переместите свой packages/components/src папку где-нибудь еще в вашем проекте, а затем создайте в packages/components вместо packages/components/dist

      root
  apps   
    webapp1
    webapp2
  packages
    components
  src
    components

У меня есть аналогичная установка в этом монорепозитории инструментов, который я создал

Answer 2

В качестве альтернативы подходу @nicksaroba, если вы не хотите реструктурировать макет своего проекта, вы можете просто настроить псевдоним:

      // apps/webapp/webpack.config.js

module.exports = {
    // ...
    resolve: {
        alias: {
            "components": "@mycompany/components/dist/"
        }
    },
    // ...
};