Относительный путь к статическим css-файлам не загружается на новую вкладку

#reactjs

Вопрос:

Здравствуйте, у меня есть приложение react, и я установил «домашнюю страницу»: «./» в файле package.json, это работает для меня, когда мое приложение загружается из подкаталога. Все файлы Js и CSS получают относительные пути в своих атрибутах href.

URL целевой страницы: https//:<my-domain>/<sub-directory-path>

Проблема возникает, когда я нажимаю на ссылку со своей целевой страницы, она открывает новую вкладку в браузере, и браузер пытается загрузить страницу, но это не удается и выдает следующую ошибку:

 Refused to apply style from 'https:<my-domain>/<sub-directory-path>/somepage/static/css/8.28838c0e.chunk.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
 

Когда я зарегистрировался на вкладке элементы браузера, ссылки CSS загружаются так, как указано ниже, и это то же самое на моей целевой странице

 <link href="./static/css/8.28838c0e.chunk.css" rel="stylesheet"> 
 

Я думаю, что из-за открытия новой вкладки и изменения URL-адреса CSS пытается загрузиться с относительного пути, и именно поэтому возникает ошибка.

Есть идеи, как это исправить? ИЛИ я не должен открывать новую вкладку, если для ключа домашней страницы в файле package.json задан относительный путь?

Ответ №1:

Попробуйте указать тип файла css type="text/css" и удалить точку из пути ссылки css href="static/css/8.28838c0e.chunk.css"

Строка html должна выглядеть следующим образом:

<link rel="stylesheet" type="text/css" href="static/css/8.28838c0e.chunk.css"/>

Комментарии:

1. Пожалуйста, укажите дополнительную информацию в своем ответе. Как это написано в настоящее время, трудно понять ваше решение.