Wie kann man den Pfad des Angular Cli-Bündels ändern?

Question

Nach meiner Bewerbung in meinem index.html Aufbau sieht die Dateireferenz wie unten,

<script type="text/javascript" src="inline.c15b1b72bcd63b7c92ca.bundle.js"></script> 

(zum Beispiel habe ich nur für diese Datei gezeigt habe).

Da muss ich meine Anwendung in Server "xyzwebsite.com/app" ausführen.

Ich brauche gebündelt Dateien auf die „app“ Ordner zu kopieren, aber wenn ich versuche zu tun, dass ich 404 nicht gefunden Fehler.

Ich bin neu für Angular cli und Bündelung der App und all diese Stunts! Wie kann ich das beheben?

Vielen Dank im Voraus!

Answer 1

Entsprechend der official documentation können Sie einfach den root und den outdir Parameter angeben, der den Speicherort für Ihre Datei definiert. Setzen Sie sie einfach in Ihr/app-Verzeichnis und es geht Ihnen gut.

Die generierte Datei an anderer Stelle verschieben zu müssen, scheint meiner Meinung nach keine gute Idee zu sein, besser ist es, sie direkt am richtigen Ort zu generieren.

Answer 2

ng bauen --base-href/app/

Zunächst erwartete ich, dass die Basis-Tag in index.html Ändern würde den Trick: Aber nach dem Bauprozess scheint es festgelegt werden auf Standard (/) es sei denn, Sie fügen die oben genannte Option hinzu.

Answer 3

Mit webpack.config.js

Wenn Sie viel mehr Kontrolle Bündelpfad ändern webpack.config.js Datei anstatt .angular-cli.json Datei dies dann tun.

1. Run `ng eject` 

Dieser Befehl webpack.config.js Datei in Ihrem Stammverzeichnis aus. Sie können diese Datei konfigurieren.

2. Run `npm install` 

Als npm Auswurf neue Abhängigkeiten in den Lader im Zusammenhang, diese Bedürfnisse installiert werden, die unter Verwendung der oben Befehl ausgeführt werden kann.

3. "output": { 
    "path": path.join(process.cwd(), "dist"), 
    "filename": "scripts/[name].[chunkhash:20].bundle.js", 
    "chunkFilename": "scripts/[id].[chunkhash:20].chunk.js" 
    } 

In webpack.config.js Dateiausgabe Eintrag bearbeiten und fügen Sie Ihren gewünschten Verzeichnisnamen für JS-Dateien wie oben gezeigt. Damit können Sie die Kontrolle über den Bündelungsweg erhalten.

Ich hoffe, das wird hilfreich sein!