Webpack модуль, который содержит node_modules

Question

Вопрос

Я хочу внести изменения в библиотеку JavaScript с открытым исходным кодом. Используя webpack и npm и сохраняя все локально, какие есть варианты, чтобы внести изменения в локальный модуль и импортировать его в проект вместо общедоступного модуля npm, загруженного из реестра? Локальный модуль и приложение-потребитель также будут контролироваться исходными кодами в двух отдельных репозиториях git.

проблема

Я тестирую это в приложении Aurelia, но думаю, что это проблема webpack и npm. У меня есть приложение под названием my-app, которое зависит от привязки aurelia. Я хочу внести локальные изменения в привязку к aurelia и перенести их на развилку в GitHub. Моя структура проекта выглядит так:

└───my-app
    ├───.git
    ├───dist
    ├───node_modules
    │   └───aurelia-binding
    |       ├───.git
    │       ├───dist
    │       └───src
    └───src

При сборке и запуске все работает как положено. Чтобы внести изменения в привязку aurelia и протестировать их в my-app, мне нужно установить ее зависимости и собрать ее. Это приводит к такой структуре:

└───my-app
    ├───dist
    ├───node_modules
    │   └───aurelia-binding
    |       ├───.git
    │       ├───dist
    |       ├───node_modules
    |       |   └───dependencies...
    │       └───src
    └───src

Когда node_modules установлены на зависимости, webpack выдает ошибку во время выполнения. Ошибка может выглядеть как проблема с модулем aurlia, но я не верю, что это так.

Unhandled rejection Error: Error invoking SVGAnalyzer. Check the inner error for details.
------------------------------------------------
Inner Error:
Message: __WEBPACK_IMPORTED_MODULE_1_aurelia_pal__.a.createElement is not a function

Я также попробовал это с помощью npm link с библиотекой, клонированной рядом с my-app, а не внутри, но получил тот же результат.

Answer 1

Я использовал следующее дополнение к webpack.config.js, чтобы иметь возможность использовать связанные пакеты npm/yarn. Это заставляет веб-пакет разрешать модули только с использованием основных узловых модулей, а не "ближайших".

resolve: {
    extensions: [".ts", ".js"],
    symlinks: false,
    modules: ["ClientApp", path.resolve('node_modules')],
}

Где "ClientApp" - это папка, в которой находится мое приложение aurelia. Параметр symlinks используется, чтобы запретить веб-пакету разрешать символьный путь к абсолютному пути.

Предупреждение: с помощью этой настройки вы обойдете проверку версии по npm, так что вы несете ответственность за связывание совместимой версии.