Fehlerbehebung bei Frontend-Pipeline-Fehlern in AEM as a Cloud Service
Beim Konvertieren einer Full-Stack-Pipeline in eine Nur-Frontend-Pipeline (FE) in AEM as a Cloud Service können Build-Fehler aufgrund plattformspezifischer Abhängigkeiten und strenger Verknüpfungsanforderungen auftreten. Das Generieren von package-lock.json unter Windows oder macOS kann zu Inkompatibilitäten mit der Linux-basierten Cloud Manager führen. Darüber hinaus erzwingen FE-Pipelines Code-artige Prüfungen, die in Full-Stack-Maven-Builds nicht vorhanden sind.
Hinweise
- Wenn Cloud Manager eine Frontend-Pipeline ausführt, führt es nicht zuerst die npm-Installation aus, sondern nimmt einfach die in Git enthaltene
package-lock.jsonund führt sienpm audit --production --audit-level=criticalaus. Allerdings installiert eine Full-Stack-Pipeline die von uns angeforderten Node/NPM-Versionen über das frontend-maven-plugin. Sie führt jedoch die npm-Installation aus, sodass wir das Problem nicht in der Full-Stack-Pipeline sehen.
Beschreibung description
Umgebung
- Produkt: AEM as a Cloud Service - Sites
- Pipeline: Nur Frontend-Pipeline (FE) über Cloud Manager
- Knotenversion: 14.19.1
- npm-Version: 6.14.x
- Betriebssystem für lokale Builds: Windows (lokal), Linux (Cloud Manager-Container)
- Erforderliche Berechtigungen: Rolle „Bereitstellungs-Manager“ in Cloud Manager
Problem/Symptome
- Die Pipeline schlägt während der npm-Installation fehl und verursacht Fehler wie * fseevents, auf die von chokida r* nicht zugegriffen werden kann
- Fehler im Zusammenhang mit fehlenden oder nicht übereinstimmenden
package-lock.json - Lokale Builds sind unter Windows oder Mac erfolgreich, schlagen jedoch in der Cloud Manager-Pipeline fehl
- Hunderte von ESLint-/Code-ähnlichen Fehlern verursachen Pipeline-Fehler, die nur FE betreffen, während Full-Stack-Pipelines diese Prüfungen standardmäßig nicht erzwingen
Lösung resolution
Führen Sie zur Behebung des Problems folgende Schritte aus:
-
Stellen Sie sicher, dass
package-lock.jsonimui.frontendvorhanden ist und in Ihr Repository übertragen wird. -
Generieren Sie
package-lock.jsonundnode_modulesmithilfe einer Linux-Umgebung (verwenden Sie das Windows-Subsystem für Linux oder Docker). Verwenden Sie die folgenden Befehle in einem WSL-Terminal, um plattformspezifische Abhängigkeitsprobleme für reine FE-Pipelines zu reproduzieren und zu beheben:code language-none cd /path/to/your/project rm -rf package-lock.json node_modules npm install git add package-lock.json git commit -m "Regenerate package-lock.json on Linux"
Oder in einem Linux-Container ausführen:code language-none docker run --rm -v $(pwd):/app -w /app node:16-alpine \ sh -c "rm -rf node_modules package-lock.json && npm install" -
Aktualisieren Sie veraltete Abhängigkeiten einschließlich Jest, Storybook und Webpack.
-
Verwenden Sie
npm auditmit Flags für Produktions- und kritische Audit-Ebene, um verbleibende Abhängigkeitsprobleme zu identifizieren. Beispiel:npm audit --production --audit-level=critical -
Übertragen Sie die neu generierte
package-lock.json-Datei aus der Linux-Umgebung in Ihr Repository. -
Änderungen an die Verzweigung pushen, die von der reinen FE-Pipeline verwendet wird.
-
Führen Sie die Nur-FE-Pipeline in Cloud Manager erneut aus.
-
Beheben Sie alle ESLint-/Code-ähnlichen Fehler, die während des Build-Prozesses gemeldet wurden. Alle Link-Fehler müssen für eine erfolgreiche Bereitstellung behoben werden.
-
Wenn dies nur zu Validierungszwecken erforderlich ist, entfernen Sie in
package.jsonvorübergehend den Link aus dem Build-Skript . Dies wird jedoch für die Verwendung in der Produktion nicht empfohlen. -
Vergewissern Sie sich, dass der Build-Schritt ohne Abhängigkeiten oder Verknüpfungsfehler erfolgreich abgeschlossen wurde.
-
Wenn die Bereitstellung erfolgreich ist, die Stile und Skripte Ihrer Site jedoch nicht geladen werden, überprüfen Sie die Dispatcher-Einstellungen und die CDN-Konfiguration. Stellen Sie sicher, dass Ihr aktivierter vhost die richtige
ServerAliasfür die statische Domain enthält. Anweisungen hierzu finden Sie unter Frontend-Pipeline-Bereitstellung unterbricht die Website. -
Wenn die Pipeline mit
BUILD_NPM_AUDIT_ERRORfehlschlägt, entfernen Sie alle widersprüchlichen SiteConfig- oder HtmlPageItemsConfig-Knoten. Anweisungen hierzu finden Sie Wie Sie BUILD_NPM_AUDIT_ERROR in der AEM as a Cloud Service-Frontend-Pipeline beheben.
Hinweise
-
Die reine FE-Pipeline erzwingt strengere Code-Stilprüfungen als Full-Stack-Maven-Builds. Alle Link-Fehler müssen vor der Bereitstellung behoben werden.
-
Sie können den Prozess der Behebung von JavaScript- und CSS-Verknüpfungsfehlern automatisieren, indem Sie das folgende Skript zu Ihrem
package.jsonhinzufügen:code language-none "scripts": { "lint:fix": "npm run lint:js:fix && npm run lint:css:fix" }
Auf diese Weise können Sie npm run lint:fix ausführen, um viele Verknüpfungsprobleme automatisch zu korrigieren, bevor Sie Änderungen per Push übertragen.