2017-02-04 2 views
0

Wenn ich ng dienen und meine Webapp mit dem Webpack laufen Winkel-CLI bietet nur für die Front-End-Umgebung alles perfekt rendert, aber wenn ich benutze ng Build oder ng Build --prod und lief es mit einem Express-Server und Back-End hat es keine Bilder, CSS oder Javascript geladen, nur die Roh-HTML aus der eckigen App. Ich suchte herum und fand angular-cli.json und fügte meinen img-Ordner, Schriftarten-Ordner, css-Ordner in Assets und alle js-Dateien in das scripts-Array und css-Dateien in das styles-Array ein, aber jetzt wird es nicht mehr erstellt, da alle Pfade unterbrochen sind .Angular CLI und NG Build breaking Pfade zu CSS, Fotos, Schriftarten, Bilder und alle

Es gibt mir zwei Seiten mit rotem Text in meiner Konsole, die mir sagen, dass Bilder, Schriftarten und andere Dateien nicht aufgelöst werden können. Offensichtlich hat sich das um den relativen Pfad herum geändert und alles fürchterlich kaputt gemacht, wie repariere ich das auf Build, ohne Pfadänderungen fest codieren zu müssen?

+0

könnten Sie erfassen Ihre Konsole und ne twork Registerkarte –

+0

verwenden Sie einfach./Pfad zu Ihren Bildern zum Beispiel, wenn Ihr Hintergrund ist ../../../bg.png als ./bg.png –

+0

hm meine Konsole ist 17603 Zeichen aus rotem Text, Art von über das Kommentar Limit: P Ill bekommen in einige: Fehler in ./~/css-loader!./~/postcss-loader!./src/css/grayscale.min.css Modul nicht gefunden: Fehler: kann nicht Lösung '../img/downloads-bg.jpg' in 'C: \ Benutzer \ Sean \ OneDrive \ Webseiten \ 000 \ lasttry \ src \ css' @ ./~/css-loader!./~/postcss- loader! ./src/css/grayscale.min.css 6: 3750-3784 @ ./src/css/grayscale.min.css @ verschiedene Stile FEHLER in ./~/css-loader!./~ /postcss-loader!./src/bootstrap.min.css Modul nicht gefunden: Fehler: Kann '../fonts/glyphicons-halflings-regular.eot' nicht auflösen i – seanEd

Antwort

2

Es scheint, dass Sie versuchen, die Website aus einem Unterverzeichnis zu laden. Sie sollten in der Lage sein, die Fehler zu beheben, indem Sie das Basis-href = "" -Tag im Kopf von index.html setzen.

https://angular.io/docs/ts/latest/guide/deployment.html#!#dev-deploy

<html> 
<head> 
    <base href="file:///C:/Users/Sean/OneDrive/webpages/000/lasttry/"> 
</head> 
<body> 
    <app-root>Loading...</app-root> 
</body> 
</html> 

... dass index.html unter der Annahme in C:/Users/Sean/Microsoft Onedrive/Webseiten/000/lasttry/

Bitte beachten Sie, dass dies nur die fix defekte Links, wenn der Pfad zu index.html wird durch die URL zugegriffen wird:

file: /// C: /Users/Sean/OneDrive/webpages/000/lasttry/index.html