Проблемы с экспортом приложения React в виде модуля npm, содержащего изображение SVG
У меня есть приложение React, созданное с помощью create-react-app. Я построил и опубликовал его как модуль npm. Все работает нормально, я могу использовать экспортированные компоненты и т. д. Единственная проблема, с которой я столкнулся, заключается в том, что изображения (SVGs) в моем случае не будут отображаться в приложении, которое импортировало этот модуль.
На рисунке ниже показана структура папок проекта, экспортируемого и публикуемого в виде модуля npm.
На рисунке ниже показана структура папок импортированного модуля при использовании в проекте.
На рисунке ниже показан компонент, который я экспортирую.
На картинке ниже показан скомпилированный экспортированный компонент.
На рисунке ниже показан компонент, указанный выше, который используется в проекте, который импортирует модуль.
На рисунках ниже показано, как приложение, которое импортирует модуль, не может отобразить изображение.
У вас есть идеи, почему изображение не загружается должным образом?
Ответы 1
Я думаю, что это из-за неправильного импорта SVG -
за документы вам нужно импортировать SVG как:
import { ReactComponent as Logo } from './udilia-logo.svg';
также это может быть связано с неправильной версией react-create-app
this feature is available with [email protected] and higher, and [email protected] and higher.