Получить React корневой путь URL
Collections.singletonList(something) является неизменяемым, тогда как Arrays.asList(something) является фиксированным размером List представления массива, в котором список и массив объединяются в кучу.
Arrays.asList(something) допускает внесение в него неструктурных изменений, которые отражаются как на Списке, так и на объединенном массиве. Он выдает UnsupportedOperationException для добавления, удаления элементов, хотя вы можете установить элемент для определенного индекса.
Любые изменения, внесенные в список, возвращенные Collections.singletonList(something), приведут к UnsupportedOperationException.
Кроме того, емкость списка, возвращаемого функцией Collections.singletonList(something), всегда будет 1 в отличие от Arrays.asList(something), чья емкость будет размером массива с поддержкой.
3 ответа
Это можно сделать, установив свойство homepage в package.json.
При создании проекта вы видите сообщение, объясняющее его:
Проект был построен при условии, что он размещен в корневом каталоге сервера. Чтобы переопределить это, укажите домашнюю страницу в вашем package.json. Например, добавьте это, чтобы построить его для GitHub Pages:
"homepage": "http://myname.github.io/myapp"См. Документацию: Развертывание: Построение для относительных путей
Если вы сделаете это, он также должен работать на производстве, когда он работает в вашей локальной среде разработчика.
В вашем случае установите
"homepage": "https://example.com/interface/", чтобы он работал на производстве. Вам не нужен дополнительный код для этого.Имейте в виду, что вам, возможно, придется правильно импортировать пути к изображениям, чтобы логика обрабатывалась веб-пакетом. У вас не должно быть реальных веб-путей в ваших компонентах, просто импортируйте вещи из путей, которые есть в вашей среде разработки, и магия работает.
import example from 'images/example.png'; [...] <img src={example} />См. Добавление изображений, шрифтов и стилей и . Использование общей папки: Когда использовать общую папку
Я нашел решение: Webpack получает ответный корневой URL-адрес в переменной env PUBLIC_URL
Решение состоит в том, чтобы изменить изображение src:
<img src=`${process.env.PUBLIC_URL}/images/example.png`
, которое он работает в производстве, в развитии и в любом другом контексте. Спасибо за вашу помощь
Если я правильно понимаю вашу проблему, вы хотите иметь возможность установить другой корневой путь, основанный на вашей среде разработки и вашей производственной среде.
К счастью, create-реагировать-приложение позволяет вам создавать переменные среды, используя файл .env.
Вам понадобится один из этих файлов как на вашем локальном компьютере, так и на производстве. Обратите внимание, что вы НЕ ДОЛЖНЫ добавлять эти файлы в систему контроля версий, поскольку они обычно содержат секретные ключи, и даже если они этого не делают, это хорошая практика.
После того как вы создали файл .env, вам нужно будет поставить перед всеми переменными среды префикс REACT_APP<environment variable>, так что в этом случае, REACT_APP_ROOT_PATH. Затем вам нужно будет установить его следующим образом:
REACT_APP_ROOT_PATH=localhost/ для вашей локальной среды и
REACT_APP_ROOT_PATH=example.com/interface/ для вашей локальной среды.
Для более продвинутого использования этой функции, вот некоторая документация: https://facebook.github.io/create-react-app/docs/adding-custom-environment-variables#expanding-environment-variables -in-env
Надеюсь, это поможет.