In der mit grunt erstellten Angular-Anwendung fehlen Elemente
Ich habe eine Anwendung mit Yeoman und AngularJS (und allem, was dazu gehört, wie Grunt und Bower) erstellt.
Alles funktioniert perfekt, wenn es lokal ausgeführt wirdgrunt serve
. Nach dem Ausführen von grunt und dem Bereitstellen der Anwendung fehlen jedoch einige Elemente, und ich bin mir nicht sicher, wie dies am besten gelöst werden kann.
Erstens scheint das Ausführen von Grunt die Bilder in dist zu kopieren, aber es benennt sie um, ohne die Referenzen im CSS anzupassen.app/images/uparrow.png
wirddist/images/3f84644a.uparrow.png
.
Hier ist eine Zeile aus der main.scss:
.table.sortable th.sorted-asc { background-image: url(../images/uparrow.png); }
Wenn es während des Erstellungsprozesses in CSS kompiliert wird, wird der Pfad nicht neu geschrieben, sodass der Browser versucht, ihn zu ladendist/images/uparrow.png
was fehlt.
Zweitens gibt es ein Problem beim Laden der Schriftarten für das Bootstrap-Plugin. Das Bootstrap-CSS unterapp/bower_components/bootstrap/dist/css/bootstrap.css
Verweise../fonts/glyphicons-halflings-regular.woff
. Der relative Pfad wird in aufgelöstapp/bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.wof
und das funktioniert einwandfrei.
Sobald das Vendor-CSS erstellt wurde, wird es unter in einer einzigen CSS-Datei zusammengefasst und minimiertdist/styles/8727a602.vendor.css
. Der relative Pfad zur Schriftart wird jedoch nicht neu geschrieben. Es wird also versucht, nach Schriften im Internet zu suchendist/fonts
Ordner, anstattdist/bower_components/bootstrap/dist/fonts/glyphicons-halflings-regular.wof
wo die datei eigentlich ist.
Jeder Rat sehr geschätzt.