Laravel localhost/public/index.php не показывает фоновое изображение и svgs, но «php artisan serve» их показывает
У меня есть небольшой красивый проект laravel на моем компьютере.
В файле welcome.blade.php у него есть фоновое изображение. И изображение находится на
public/images/
каталог.
Я использовал следующий CSS для их вызова и представления:
html, body {
color: #f4f6f7;
font-family: 'Nunito', sans-serif;
font-weight: 500;
height: 100vh;
margin: 0;
background-image: url('/images/back.png');
-webkit-background-size: cover;
-moz-background-size:cover;
-o-background-size:cover;
background-size: cover;
}
Этот проект также содержит значок favicon, и он расположен в соответствии с дизайном laravel.
The problem is:
Когда я иду в localhost/got/public/index.php формирую свой хром
он загружает мой проект, но не может отображать или загружать фоновое изображение или значок фавикона.
Но когда я бегу php artisan serve
работает хорошо без проблем.
Что мне не хватает?
отличный. Спасибо. Это сработало... Но интересно, почему!
пожалуйста. Посмотрите на ответ для части why.
Ответы 4
пожалуйста, используйте это:
background-image: url('{{ asset('images/back.png') }}');
-webkit-background-size: cover;
-moz-background-size:cover;
-o-background-size:cover;
background-size: cover;
}
Спасибо за ваш ответ. Я пробовал это, но мой редактор, может быть, что-то не так... это не работает...
Попробуйте добавить следующий код в свой webpack.mix.js
.опции({ процессCssUrls: ложь, })
где я должен включить это?
вы найдете webpack.mix.js в корне вашего проекта laravel.
При загрузке файлов заголовков, включая файлы .css, используйте {{ asset("filesurl") }}
Ваш путь отличается, когда вы используете localhost/got/public/. Попробуйте создать виртуальный хост для своего проекта.
Ну, вот часть ПОЧЕМУ. Когда вы используете ремесленную подачу, путь к изображению (ОТНОСИТЕЛЬНЫЙ: /images/back.png) относится к http://localhost:8000/images/back.png. И когда вы используете свой локальный сервер, изображения снова ссылаются на http://localhost/images/back.png, НО ваш адрес localhost/got/public/images/back.png.
Мне интересно развернуть его в LIVE. что могло случиться? так как внутренних изменений нет, будет ли он хорошо работать на живом сервере?
Преимущество использования виртуального хоста заключается в том, что вы можете убедиться, что ваш локальный проект работает ПОЧТИ без проблем на хосте. Я сказал почти потому, что некоторые аспекты (например, загрузка файлов) могут иметь некоторую несовместимость в зависимости от локальной ОС. И если мой ответ помог, пожалуйста, отметьте его как правильный ответ.
да, ваш ответ решил мою проблему. Я опоздал, потому что думал, какой ответ выбрать.
Ваш путь отличается, когда вы используете
localhost/got/public/. Попробуйте создать виртуальный хост для своего проекта.