Laravel 8 läd die Bootstrap CSS nicht

Werner S

Neues Mitglied
Grüß euch,

ich setze mir gerade ein neues Projekt mit Laravel 8 und Bootstrap auf.
Aus mir unbekannten Gründen läd er die css und js file beim Aufruf der Seite nicht auf.

composer create-project --prefer-dist laravel/laravel testproject
composer require laravel/ui
php artisan ui bootstrap
php artisan ui bootstrap --auth
npm install
npm run dev
php artisan migrate

Soweit funktioniert auch alles. Er läd einfach nur nicht die CSS und JS
Wenn ich den Quellcode im Brwoser aufrufe und dann die CSS sehen will, spuckt er mir einen 404 aus.
Soweit ich jetzt durch Google gefunden habe, sind eigentlich keine weiteren Schritte nötig. Liegt das evtl an MAMP?
 

JR Cologne

Administrator
Teammitglied
Nabend,

kannst du mal ein paar Screenshots bzw. Code-Schnipsel posten, die es für uns ersichtlich machen, wie das CSS und JS eingebunden wird und was für Fehler auftreten bzw. was genau geladen wird?

Interessant wären vor allen Dingen:

  • die Netzwerkinfos mit den Anfragen bzw. geladenen Dateien der Website
  • der Inhalt der CSS-/JS-Dateien im Browser (du sagst ja, hier gibt es ein 404: ist das Ergebnis die Laravel 404-Seite oder ein klassischer 404 des Servers?)
  • die Templates, in denen die CSS-/JS-Dateien eingebunden werden
  • der Inhalt der unkompilierten CSS-/JS-Dateien (Wird hier Bootstrap etc. richtig eingebunden?)
  • Ist bootstrap überhaupt im node_modules-Ordner vorhanden?
  • Werden die Dateien durch Laravel Mix ordnungsgemäß im public-Ordner bereitgestellt?
  • Gibt Laravel Mix o.ä. irgendwelche Fehler/Hinweise aus?
 

Werner S

Neues Mitglied
Hi,

ich bin gerade am falschen PC (Arbeit), kann dir nicht alle aber schon mal ein paar Infos geben und wie ich das nun doch nach 8 Stunden endlich gelöst habe.

Windows 10, MAMP Server mit PHP 7.4.1, node-v14, Composer v2.0.8, Laravel 8 und Bootstrap

-- Falscher PC, daher erst heute Abend Infos.
-- Inhalt der CSS-/JS Files gibt es nicht, den diese sind nicht vorhanden. Beim Aufruf dieser kommt die Laravel 404 Seite.
-- In der app.blade.php findet sich folgendes
Head:
<!-- Scripts -->
<script src="{{ asset('js/app.js') }}" defer></script>
<!-- Styles -->
<link href="{{ asset('css/app.css') }}" rel="stylesheet" />

Im Quelltext sieht es dann so aus
HTML:
<!-- Scripts -->
<script src="http://127.0.0.1:8000/js/app.js" defer></script>

<!-- Styles -->
<link href="http://127.0.0.1:8000/css/app.css" rel="stylesheet" />

und der Aufruf von http://127.0.0.1:8000/css/app.css bzw. app.js gibt einen Laravel 404

-- Nein, Bootstrap wird nicht richtig eingebunden. Dazu später mehr.
-- Ja, Bootstrap ist im node_modules Ordner vorhanden
-- Nein, die werden nicht im public Ordner eingebunden, da liegt wohl auch das Problem
-- Nein, es gibt keine Fehlermeldung. ein nmp run dev sollte unteranderem die JS/CSS Files im public Ordner bereitstellen, dies hat es aber nicht gemacht und beim Durchlauf kam auch keine Fehlermeldung. Nur die üblichen WARN Meldungen.
Auch ein mehrfaches ausführen der npm run dev behob das Problem nicht.

zitat:
PS C:\MAMP\htdocs\test> npm run dev

> @ dev C:\MAMP\htdocs\test
> npm run development


> @ development C:\MAMP\htdocs\test
> mix

        Additional dependencies must be installed. This will only take a moment.

        Running: npm install resolve-url-loader@3.1.0 --save-dev --legacy-peer-deps

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@2.3.1 (node_modules\chokidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@2.3.1: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.13 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.13: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

        Finished. Please run Mix again.

PS C:\MAMP\htdocs\test>

Scheint wohl noch ein Bug zu sein den wie oben schon geschrieben, npm run dev sollte den CSS und JS Ordner im public anlegen was es nicht gemacht hat. Ich habe jetzt die webpack.mis.js genommen und folgenden Teil

Javascript:
mix.js('resources/js/app.js', 'public/js').sass('resources/sass/app.scss', 'public/css').sourceMaps();

durch

Javascript:
mix.js('resources/js/app.js', 'public/js').react().sass('resources/sass/app.scss', 'public/css', [
    //
]);

ersetzt und noch mal npm run dev ausgeführt. Danach lief alles so wie es soll.
 

Mat

Aktives Mitglied
Als ich vor einer Weile mal wieder damit gearbeitet hatte, gab es auch Probleme.

Der Mixer-Kram geht mir sowieso auf den Sack. Mit HTTP2 sollte das doch alles Schnee von Gestern sein. :poop:

Bin jedenfalls froh, dass du dein Problem lösen konntest und die Lösung mit uns geteilt hast.
 

Werner S

Neues Mitglied
Als ich vor einer Weile mal wieder damit gearbeitet hatte, gab es auch Probleme.

Der Mixer-Kram geht mir sowieso auf den Sack. Mit HTTP2 sollte das doch alles Schnee von Gestern sein. :poop:

Ja das komme ich mittlerweile ins Grübeln ob Laravel oder allgemein ein Framework für mich das richtige ist.
Es gibt nur einen Einzelnen Entwickler in der Firma, mich. Bis Mitte 2020 habe ich alles ohne Frameworks gemacht. Kleine/Große Seiten, Shops, Blogs, Userbackend etc.
Aktuell schlage ich mich in Laravel mehr mit Problemen rum, als das es damit schneller voran geht.
 

JR Cologne

Administrator
Teammitglied
Bis Mitte 2020 habe ich alles ohne Frameworks gemacht. Kleine/Große Seiten, Shops, Blogs, Userbackend etc.

What? Du hast ganze Shops komplett ohne Frameworks entwickelt?! :oops: :D

Ich meine, Respekt! Aber das ist doch nicht wirklich effizient?
Nutzt du denn wenigstens bestimmte Komponenten und Libraries oder schreibst du jedes Mal wieder tausende Zeilen Boilerplate-Code?
 

Mat

Aktives Mitglied
Aktuell schlage ich mich in Laravel mehr mit Problemen rum, als das es damit schneller voran geht.

Ist ja bei neu gelernten Sachen immer so. Es lohnt sich aber schon, die Zeit zu investieren. Da bleibt auf jeden Fall was Nützliches hängen, selbst wenn du dich am Ende für ein anderes oder eigenes Framework entscheidest.

What? Du hast ganze Shops komplett ohne Frameworks entwickelt?! :oops: :D

Ich meine, Respekt! Aber das ist doch nicht wirklich effizient?
Nutzt du denn wenigstens bestimmte Komponenten und Libraries oder schreibst du jedes Mal wieder tausende Zeilen Boilerplate-Code?

Das würde mich aber auch interessieren. Shop und Backend muss doch ein Albtraum gewesen sein
 

Werner S

Neues Mitglied
What? Du hast ganze Shops komplett ohne Frameworks entwickelt?! :oops: :D

Ich meine, Respekt! Aber das ist doch nicht wirklich effizient?
Nutzt du denn wenigstens bestimmte Komponenten und Libraries oder schreibst du jedes Mal wieder tausende Zeilen Boilerplate-Code?

Nunja, unsere 3 Entwickler in der Firma wurden wegen Diebstahl vor 7 Jahren gekündigt, Chef hat mal mitbekommen das ich für das phpBB Forum mal was kleines geschrieben habe und seit dem kümmere ich mich darum. Mittlerweile mache ich das aber nur noch als Hobby, nicht mehr Beruflich weil ich wie man weiter unten Lesen kann auf kleine Probleme gestoßen bin.

Das Problem warum bis jetzt ohne ein PHP Framework, was das Coding angeht brauche ich ewig lange zum lernen. Was andere an einem Tag gelernt und halbwegs Sicher einsetzen können, brauche ich 1-2 Monate für und muss selbst dann noch Googeln. Da ich aufgrund der Lernschwäche auch mit Englisch nicht voran komme, trägt sein ganzes dazu.
Javascript zb. ist für mich zu komplex so das ich meistens auf was fertiges zurückgreife.

Ja, ich bin zwar nicht der PHP/MySQL Profi und kann mir was das Coding angeht komplexe Sachen meistens nie merken, aber ja, im Grunde habe ich bis Mitte 2020 alles ohne ein PHP Framework gemacht.
Grundgerüst auf Basis von Smarty, PHPMailer, Bootstrap, fertige Bootstrap Themes und JQuery, mit mehr habe ich meine Projekte nie angefangen.
 

Mat

Aktives Mitglied
Das Problem warum bis jetzt ohne ein PHP Framework, was das Coding angeht brauche ich ewig lange zum lernen. Was andere an einem Tag gelernt und halbwegs Sicher einsetzen können, brauche ich 1-2 Monate für und muss selbst dann noch Googeln. Da ich aufgrund der Lernschwäche auch mit Englisch nicht voran komme, trägt sein ganzes dazu.
Javascript zb. ist für mich zu komplex so das ich meistens auf was fertiges zurückgreife.

Ja, ich bin zwar nicht der PHP/MySQL Profi und kann mir was das Coding angeht komplexe Sachen meistens nie merken, aber ja, im Grunde habe ich bis Mitte 2020 alles ohne ein PHP Framework gemacht.

Jetzt ein bisschen Offtopic, aber ich empfehle Notizen oder "Berichte".

Immer, wenn ich beim Programmieren etwas nachschlagen musste, oder Probleme hatte, mache ich mir eine Notiz dazu. Die Notizen sammle ich in einer Art Wissenssammlung. Das sind überwiegend Markdown-Dateien, die nach Thema in verschiedenen Ordnern untergebracht sind. Teilweise packe ich da auch Codevorlagen rein.

Als Beispiel, um bei PHP zu bleiben:

1611605716917.png


Wenn ich das dann nächstes Mal mache, kann ich direkt nachschlagen. Und wenn ich oft genug nachgeschlagen habe, muss ich irgendwann nicht mehr reinschauen.

Chef hat mal mitbekommen das ich für das phpBB Forum mal was kleines geschrieben habe und seit dem kümmere ich mich darum.

Ah, ein klassischer Fall von zu langsam weggelaufen :D
 

JR Cologne

Administrator
Teammitglied
Das Problem warum bis jetzt ohne ein PHP Framework, was das Coding angeht brauche ich ewig lange zum lernen. Was andere an einem Tag gelernt und halbwegs Sicher einsetzen können, brauche ich 1-2 Monate für und muss selbst dann noch Googeln. Da ich aufgrund der Lernschwäche auch mit Englisch nicht voran komme, trägt sein ganzes dazu.
Javascript zb. ist für mich zu komplex so das ich meistens auf was fertiges zurückgreife.
Verstehe. Lass dich von anderen, die alles (anscheinend) viel schneller und effizienter erledigen bzw. lernen, nicht verunsichern.
Solange du Spaß an der Sache hast und pragmatische Lösungen findest, ist alles gut.

Insbesondere in der JavaScript-Welt mit den zahlreichen Frameworks und dem immer wieder neu aufkommenden "modernen, heißen Scheiß", kann ich dieses Gefühl ganz gut nachvollziehen.
Man muss da wirklich aufpassen, dass man sich von den zahlreichen Meinungen und Einflüssen aus der Umgebung nicht zu sehr verunsichern lässt und einfach sein Ding macht.

Das schätze ich in gewisser Weise auch so sehr an PHP und der zugehörigen Community: Da geht es einfach deutlich entspannter und pragmatischer zu.

Ja, ich bin zwar nicht der PHP/MySQL Profi und kann mir was das Coding angeht komplexe Sachen meistens nie merken, aber ja, im Grunde habe ich bis Mitte 2020 alles ohne ein PHP Framework gemacht.
Grundgerüst auf Basis von Smarty, PHPMailer, Bootstrap, fertige Bootstrap Themes und JQuery, mit mehr habe ich meine Projekte nie angefangen.
Alles klar, ist ja im Grunde auch völlig legitim.

Wenn einem Frameworks zu kompliziert und "fancy" sind, kann man auch gut auf die altbewährten Mittel setzen.
Lediglich aus Sicherheitsgründen und aus Gründen der Wiederverwertung würde ich zumindest auf bestimmte Komponenten und Libraries setzen.

Lediglich bei größeren Projekten, insbesondere im Zusammenspiel mit weiteren Entwicklern im Team, werden dann Frameworks irgendwann doch unerlässlich.
 
Oben Unten