Все стили (bootstrap, css) исчезают, когда указанный компонент c отображается и обновляется в браузере. - PullRequest
0 голосов
/ 17 апреля 2020

Я сталкиваюсь с этой проблемой с компонентом, который при рендеринге в браузере удаляет все стили, включая bootstrap css & js. И это происходит, когда я go на конкретный путь:

http://localhost: 3000 / profile / 5e85e1ce61fb132564b2e315

Если я go на эту ссылку через щелкнув по предполагаемой гиперссылке на приложение, оно загрузится в первый раз. Когда я повторяю sh, все стилистика исчезает. Это не относится к другим путям и компонентам, которые отображаются нормально независимо от того, сколько раз вы обновляете их sh.

Я получаю эти ошибки в консоли, когда это происходит:

Refused to apply style from 'http://localhost:3000/profile/assets/css/bootstrap.min.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
Refused to apply style from 'http://localhost:3000/profile/assets/css/mdb.min.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
Refused to apply style from 'http://localhost:3000/profile/assets/css/styles.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

Failed to load resource: the server responded with a status of 404 (Not Found)
popper.min.js:1 Failed to load resource: the server responded with a status of 404 (Not Found)
bootstrap.min.js:1 Failed to load resource: the server responded with a status of 404 (Not Found)
mdb.min.js:1 Failed to load resource: the server responded with a status of 404 (Not Found)

У меня есть эти ссылки в моем файле public / index. html. Вот как это выглядит:

<!-- Bootstrap core CSS -->
    <link href="./assets/css/bootstrap.min.css" rel="stylesheet">
    <!-- Material Design Bootstrap -->
    <link href="./assets/css/mdb.min.css" rel="stylesheet">
    <!-- Your custom styles (optional) -->
    <link href="./assets/css/styles.css" rel="stylesheet">

<!-- SCRIPTS -->
    <!-- JQuery -->
    <script type="text/javascript" src="./assets/js/jquery.min.js"></script>
    <!-- Bootstrap tooltips -->
    <script type="text/javascript" src="./assets/js/popper.min.js"></script>
    <!-- Bootstrap core JavaScript -->
    <script type="text/javascript" src="./assets/js/bootstrap.min.js"></script>
    <!-- MDB core JavaScript -->
    <script type="text/javascript" src="./assets/js/mdb.min.js"></script>

Я не понимаю, почему он пытается go к пути: http://localhost: 3000 / profile / assets / css / styles. css чтобы получить эти файлы вместо пути, который я указал в индексном файле. Он отлично работает для остальной части веб-приложения вместо этого конкретного пути и компонента.

1 Ответ

0 голосов
/ 17 апреля 2020

Проблема была решена путем добавления этого перед ссылкой в ​​разделе заголовка индекса. html file:

<base href="/">
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...