ReactJS приложение не находит изображения svg при сборке и запуске в контейнере Docker - PullRequest
0 голосов
/ 18 июня 2020

Я создал решение ASP. NET Core, которое в основном представляет собой оболочку для приложения React. Это карточная игра, в которой для представления карт используются файлы изображений svg. Когда я запускаю локально, карты отображаются так, как должны.

Проблема в том, что когда я создаю изображение Docker и загружаю его с Docker рабочего стола, изображения больше не отображаются - просто заполнитель, где каждая будет go.

Каждая карта является результатом небольшой функции:

export const Card = (params) => {
    return <img src={'./cards/' + params.card + '.svg'}
        onDoubleClick={() => { params.action( params.card ) }}
    />
}

Я думаю, что необходимый относительный путь в изображении docker должен быть изменены как-то так, чтобы файлы можно было найти.

В решении VS структура папок выглядит следующим образом:

root
   ClientApp
      public
         Cards    <== card image svgs are here
      src         <==js code here

Любые предложения относительно того, что может быть причиной того, что версия Docker не отображает изображения?

Возможно, мне лучше спросить, следует ли мне управлять структурой в Dockerfile (?) Или какой хороший способ увидеть структуру, которую Docker использует для размещения файлов в контейнере?

Редактировать Я заметил, что он не распознает подпапку (или я неправильно на нее ссылаюсь). Любые изображения, которые я помещаю, представляют собой папку public (родительская для cards).

1 Ответ

0 голосов
/ 18 июня 2020

Для ссылки на svg в publi c используйте:

<img src={process.env.PUBLIC_URL + '/yourPathHere.svg'} /> 
...