Я работаю над проектом React, и у меня проблема с указанием ресурсов изображения из файлов scss с относительными путями. Как правило, относительные пути работают локально, но после развертывания на страницах github в пути к ресурсам изображений отсутствует часть github repo name. Я не знаю, является ли это проблемой конфигурации веб-пакета, или я неправильно пишу относительные пути.
Вот моя структура папки
├───config
│ └───jest
├───public
│ └───assets
│ ├───css
│ ├───fonts
│ ├───images
│ │ ├───background
│ │ ├───icons
│ │ ├───illustration
│ │ ├───logo
│ │ └───projects
│ │ ├───one
│ │ └───two
│ ├───js
│ └───scss
│ ├───blog
│ ├───common
│ ├───default
│ ├───elements
│ ├───header
│ └───template
├───scripts
└───src
├───component
│ ├───common
│ ├───footer
│ ├───header
│ └───slider
├───elements
│ ├───blog
│ ├───common
│ ├───portfolio
│ ├───projects
│ └───tab
└───home
Пример пути к URL, определенному в файле s css:
.big-center-circle {
background: url("/assets/images/background/circle-1.svg") no-repeat center top,
}
Результирующий маршрут в развертывании
https://username.github.io/assets/images/background/circle-1.svg
Требуемый маршрут в развертывании
https://username.github.io/repository-name/assets/images/background/circle-1.svg
Я использую react-router-dom для маршрутизации, и относительные пути работают правильно в jsx файлы. У меня проблема только с URL в таблицах стилей S CSS.