Обработка ресурсов в дочерних проектах -> загрузка.svgs из node_modules
У моей команды был один гигантский изоморфный узел / реакция (my-parent-project
), но мы вывели некоторые компоненты (my-child-project
) в свои собственные пакеты npm, чтобы их могли использовать другие команды.
В этих дочерних пакетах для любого значительного образа (более 10 КБ) мы просто добавляем их в AWS, но для более мелких мы использовали webpack / url-loader для их кодирования base64 и помещаем их в связку со всем остальным. Тем не менее, я хочу уйти от объединения каждого дочернего пакета, так как он больше не имеет смысла для меня (все должно быть упаковано один раз в самом конце родительского проекта - кодовая база должна быть максимально сохранена для intellisense / типы / и т.д. до тех пор).
Но я не могу заставить веб-пакет правильно обрабатывать маленькие изображения в родительском проекте.
{
test: /\.(svg|png|jpg|gif)$/,
use: [{ loader: 'file-loader' }]
}
Svgs из дочернего проекта преобразуются; они появляются в моем выходном каталоге, и я вижу это в консоли:
c68a711b253f5eca6e4f1555fe72195c.svg 1.64 kB [emitted]
b3e15bf291ba4951f52031f32bc92a58.svg 2.46 kB [emitted]
etc...
Но чуть позже в сборке, это взрывается с этим в консоли:
ERROR in ../node_modules/my-child-project/dist/assets/icons/circle.svg
Module parse failed: /Users/johnsmith/git/my-parent-project/node_modules/my-child-project/dist/assets/icons/circle.svg Unexpected token (1:0)
You may need an appropriate loader to handle this file type.
| <!--<svg height="64" width="64">-->
| <!--<circle cx="32" cy="32" r="40" />-->
| <!--</svg>-->
Почему я получаю эту ошибку?
Кажется, я ничего не делаю, и я начинаю задумываться, не ошиблась ли моя идея...
Я мог бы:
- 1. поместить все активы в AWS/cdn/etc. и не нужно беспокоиться об этом - 2. возможно, создать пакет изображений или что-то в my-child-project
...?
- 3. жестко закодировать строку для копирования активов в my-parent-project
и как-то преобразовать ссылки, чтобы указать на них...?
- 4. как-то заставить веб-пакет не связывать файлы, а просто переносить их (с машинописью) и вставлять эти маленькие значки в код...?
Как эта ситуация идеально обрабатывается?