Ich bin wirklich zu spät zur Party, aber ich war auch extrem frustriert von diesem Problem und fand keine zufriedenstellenden Fixes oder Work arounds. Also habe ich ein paar ziemlich schmutzige Tricks ausgearbeitet, um dieses Problem hoffentlich besser zu lösen. Ich würde es gerne mit dir teilen.
Vor allem, lassen Sie uns schnell überprüfen, warum dieses Problem auftritt. Wenn usemin Ausgabe-JS/CSS-Dateien generiert, führt es einen einfachen Pfad-Join zwischen Ihrem dest-Verzeichnis und dem Ausgabeverzeichnis durch, das Sie in Ihrem Usenemin-Block angegeben haben.Also, wenn dest ist build und usemin Block ist
<!-- build:css(.) app.min.css -->
dann schließt er sich build mit app.min.css an die Ausgabedatei auszuspucken build/app.min.css
Aber dann einfach die usemin Aufgabe ersetzt in Ihrem Block den Weg zu Ihnen am Ende mit
<link rel="stylesheet" href="app.min.css"/>
, die jetzt da die HTML-Datei das falsche Verzeichnis ist die Verknüpfung ist unter build/dashboard/index.html
So dreht sich meine Arbeit rund um diese Idee: Was ist, wenn dest Verzeichnis relativ ist, wo sich die HTML-Datei befindet? Würde das nicht das Problem lösen? Also was ist, wenn das obige Beispiel destbuild/dashboard ist? Sie können sehen, dass der Speicherort der Ausgabedatei ausgegeben und korrekt verknüpft wird. Denken Sie daran, dass Sie eine Kopieraufgabe erstellen müssen, um Ihre HTML-Dateien zu kopieren. Stellen Sie daher sicher, dass Ihre HTML-Datei wie zuvor nach build/dashboard/index.html kopiert wird.
Natürlich wäre die nächste Frage, was passiert, wenn ich HTML-Dateien in mehreren Verzeichnissen habe? Wäre das nicht extrem schmerzhaft und nicht intuitiv, um ein useminPrepare-Ziel für jedes Verzeichnis zu erstellen, in dem sich HTML-Dateien befinden könnten? Aus diesem Grund erstelle ich eine ganz spezielle Aufgabe, um dieses Problem zu umgehen, während ich mein eigenes Grunzengerüst erstelle. Ich nenne es useminPreparePrepare Ja, es wird absichtlich dumm genannt, weil ich hoffe, dieses Ding eines Tages ganz zu entfernen, wenn usemin Leute eine tatsächliche Reparatur für dieses Problem machen.
Wie der Name schon sagt, ist dies eine Aufgabe zur Vorbereitung von useminPrepare-Konfigurationen. Es macht genau das, was ich oben beschrieben habe. Alle Konfigurationen spiegeln UseMinPrepare-Konfigurationen wider (die meisten werden einfach in useminPrepare kopiert), mit einer Ausnahme: Sie müssen ein Verzeichnis src angeben, um das Stammverzeichnis aller Ihrer Quellen zu identifizieren, damit es den relativen Pfad generieren kann zu den HTML-Dateien. Also in Ihrem Beispiel src: "." wird in Ordnung sein. Um useminPreparePrepare zu verwenden, importieren Sie es zuerst in Ihren Build (Sie können meinen Code einfach kopieren und einfügen, das macht mir nichts aus), benennen Sie Ihre useminPrepare-Task in useminPreparePrepare um und fügen Sie die eben erwähnte src-Eigenschaft hinzu. Stellen Sie sicher, dass Sie useminPreparePrepare mit dem gewünschten Ziel ausführen, und führen Sie dann sofort UminPrepare ohne Angabe des Ziels aus, sodass alle seiner Ziele ausgeführt werden. Dies liegt daran, dass useminPreparePrepare ein Ziel für jedes Verzeichnis generiert, relativ zu dem, wo HTML-Dateien gefunden werden, und Kopien über Ihre Konfigurationen für das useminPreparePrepare-Ziel Ihres ran. Auf diese Weise kann Ihre Konfiguration einfach nach allen HTML-Dateien suchen.
Beispiel
"useminPreparePrepare": {
// Search for HTML files under dashboard even though src is .
// because we want to avoid including files generated under build directory.
html: "dashboard/**/*.html",
options: {
src: ".",
dest: "build",
...
"usemin": {
html: ["build/**/*.html"],
...
"copy": {
html: {
files: [{
expand: true,
src: ["dashboard/**/*.html"],
dest: "build"
}
]
},
...
hoffe, das hilft! Haben Sie einen guten Tag.
EDIT: Ich erkannte, dass in dem obigen Beispiel, wenn Sie tatsächlich alle HTML-Dateien aus dem aktuellen Verzeichnis enthalten, Sie auch die generierten HTML-Dateien enthalten, wenn sie nicht vor der Zeit gereinigt werden. Also entweder Sie reinigen sie vor ihnen oder schauen Sie unter dashboard Verzeichnis. Ich würde empfehlen, src und dest Verzeichnisse zu trennen, damit config viel intuitiver aussehen könnte.