CSS не загружается в Laravel 8 Jetstream на XAMPP

#laravel #xampp #jetstream

Вопрос:

Я изучаю Laravel и использую Laravel 8 и Jetstream. Во время тестирования приложения на XAMPP css не загружается на страницах входа / регистрации. Ссылка css указывает на местоположение localhost / app / css. Он отлично работает, если я использую php artisan serve command, но не работает на XAMPP. Как мне исправить указатель css, чтобы он работал как с php artisan serve командой, так и с XAMPP?

1. вы разместили их в /public/css ?

2. @Abilogos Насколько я понимаю, эти ресурсы автоматически публикуются в общедоступном каталоге после запуска npm run dev. Кроме того, css загружается правильно, если я выполняю его с помощью команды php artisan serve . Проблема существует только с XAMPP, поскольку ссылка указывает на localhost/css/app.css, тогда как для XAMPP она должна указывать на localhost/myapp/ public/css/app.css .

3. » он должен указывать на localhost/myapp / public/css/app.css » public Папка не должна отображаться в URL-адресе, это должен быть DocumentRoot. Лучше всего было бы настроить виртуальный хостинг на Apache, например project1.local , и указать его в общедоступную папку ваших проектов. Убедитесь, что ваш APP_URL in .env установлен правильно

4. Попробуйте npm install и npm run dev . У меня была аналогичная проблема, и я решил ее с помощью этих 2 команд.

5. @brombeer Большое вам спасибо! Настройка виртуального хоста решила проблему.

Ответ №1:

в publicmix-manifest.json измените:

 "/js/app.js": "/js/app.js",
"/css/app.css": "/css/app.css"

Для

 "/js/app.js": "js/app.js",
"/css/app.css": "css/app.css"

этот метод работает для меня, плюс он работает как с XAMPP, так и с artisan serve.

1. по какой-то причине каждый раз, когда я перехожу на другую страницу или перезапускаю проект, он автоматически снова ставит «/». так что это было просто временное решение для меня. изменение микса с активом, как предложено ниже, сработало для меня

Ответ №2:

В resourcesviewslayoutsapp.blade.php , изменить:

 <link rel="stylesheet" href="{{ mix('css/app.css') }}">

Для:

 <link rel="stylesheet" href="{{ asset('css/app.css') }}">

Это будет работать в wamp или xampp.

Ответ №3:

если вы измените в файле public mix-manifest.json

 "/js/app.js": "/js/app.js",
"/css/app.css": "/css/app.css"

Для

 "/js/app.js": "js/app.js",
"/css/app.css": "css/app.css"

он не работает с файлом: /user/profile , для этого вам нужно../

поэтому вы должны использовать второй вариант, но не забудьте также изменить файл .js! итак, в: resourcesviewslayoutsapp.blade.php чаге

 <link rel="stylesheet" href="{{ mix('css/app.css') }}">
<script src="{{ mix('js/app.js') }}" defer></script>

Для

 <link rel="stylesheet" href="{{ asset('css/app.css') }}">
<script src="{{ asset('js/app.js') }}" defer></script>

а также не забудьте сделать то же самое в файле: resourcesviewslayoutsguest.blade.php чаге

Ответ №4:

Это действительно просто, вам нужно перейти к пути: ВАШ ПРОЕКТ / ресурсы / представления / макеты, здесь вы должны добавить эти 2 строки в оба файла «app.blade.php « и «guest.blade.php «

неверно

 <link rel="stylesheet" href="{{ mix('css/app.css') }}">
<script src="{{ mix('js/app.js') }}" defer></script>

Правильно:

 <link rel="stylesheet" href="{{ asset('css/app.css') }}">
<script src="{{ asset('js/app.js') }}" defer></script>

ПРИМЕЧАНИЕ: Если у вас нет строк, вы должны их добавить.