Der Versuch, eine Vue-Anwendung für Azure App Service bereitzustellen, führt zu folgendem Fehler: Modul „../package.json' nicht gefunden
P粉269847997
2023-08-31 13:58:53
<p>Ich habe ein einfaches Vue SPA, das ohne Probleme lokal erstellt und bereitgestellt wird, aber wenn ich versuche, es über GitHub-Aktionen zu erstellen und in Azure App Service bereitzustellen, wird nur Folgendes angezeigt: <strong>: (Ein Fehler ist aufgetreten, als die Anwendung gestartet '</strong>' Seite.</p>
<p>Unten finden Sie den nahezu standardmäßigen Arbeitsablauf <code>.yml</code>, die Anwendungsdienstkonfiguration und das Fehlerprotokoll beim Versuch, die Anwendung zu erstellen. </p>
<p>Ich gehe davon aus, dass diese Dateien aus dem Ordner <code>/home/site/wwwroot</code> erstellt werden, in dem node_modules installiert und package.json generiert wird. aber es scheint nicht so zu sein (bei der Überprüfung von wwwroot gibt es keine Datei, also schlägt der Build fehl?)</p>
<p>Für jede Hilfe wäre ich sehr dankbar. Ich habe mich den ganzen Tag damit beschäftigt und würde gerne weitere Informationen bereitstellen. Ich habe auch das NodeJS-Backend ohne allzu große Probleme für den App-Dienst bereitgestellt, daher bin ich mit dem Prozess vertraut – ich kann dieses Frontend einfach nicht starten! </p>
<pre class="brush:php;toolbar:false;">name: Node.js-App erstellen und in Azure Web App bereitstellen – Regalbibliothek
An:
drücken:
Geäst:
- hauptsächlich
Workflow_Dispatch:
Arbeitsplätze:
bauen:
läuft weiter: ubuntu-latest
Schritte:
- verwendet: actions/checkout@v2
- Name: Node.js-Version einrichten
verwendet: actions/setup-node@v1
mit:
Knotenversion: '16.x'
– Name: npm installieren, erstellen und testen
Lauf: |
npm installieren
npm run build --if-present
- Name: Artefakt für Bereitstellungsjob hochladen
verwendet: actions/upload-artifact@v2
mit:
Name: Node-App
Pfad: dist/
einsetzen:
läuft weiter: ubuntu-latest
Bedürfnisse: bauen
Umfeld:
Name: 'Produktion'
URL: ${{steps.deploy-to-webapp.outputs.webapp-url }}
Schritte:
- Name: Artefakt vom Build-Job herunterladen
verwendet: actions/download-artifact@v2
mit:
Name: Node-App
– Name: „In Azure Web App bereitstellen“
ID: Deploy-to-Webapp
Verwendet: azure/webapps-deploy@v2
mit:
App-Name: 'Shelf-Bibliothek'
Slot-Name: 'Produktion'
Veröffentlichungsprofil: ${{ Secrets.AZUREAPPSERVICE_PUBLISHPROFILE_11D7C84BF0CE47B68181C49B9ED47D19 }}
Paket: .</pre>
检查以下步骤以创建
VueJS
并使用 Git Hub 操作部署到 Azure 应用服务。感谢@Anthony Salemo 提供的明确步骤。
在命令提示符下,运行以下命令来创建 Vue 应用程序。
导航到应用程序的根目录
cd myvueapp
并运行或
运行
npm run build
命令进行生产构建。dist
文件夹将被创建。将应用程序推送到 GitHub 存储库。 您可以在我的 GitHub 存储库中查看可用的代码。
我的 GitHub 文件夹结构
应用服务
=>部署中心
并从 GitHub 中选择代码存储库。配置
=>常规设置
中添加启动命令
。我在 KUDU 控制台中部署的文件夹结构