How to deploy a dynamic Vue.js application into Azure App Service using Visual Studio Code

Asim Mahmood Khan 0 Reputation points
2024-04-09T16:22:39.55+00:00

Hi,

I am trying to deploy my dynamic Vue.js application using Azure App Service. The issue that I am having is that when I connect my application with GitHub repo in the deployment section and then start to deploy the web app I get the error that Deployment failed, push to GitHub repo first.

What does that mean? I do not know a workaround for this. Kindly please help me in this matter.

Regards,

Asim Khan

Microsoft Deployment Toolkit
Microsoft Deployment Toolkit
A collection of Microsoft tools and documentation for automating desktop and server deployment. Previously known as Microsoft Solution Accelerator for Business Desktop Deployment (BDD).
894 questions
Microsoft Configuration Manager Deployment
Microsoft Configuration Manager Deployment
Microsoft Configuration Manager: An integrated solution for for managing large groups of personal computers and servers.Deployment: The process of delivering, assembling, and maintaining a particular version of a software system at a site.
977 questions
Azure App Service
Azure App Service
Azure App Service is a service used to create and deploy scalable, mission-critical web apps.
7,768 questions
GitHub Training
GitHub Training
GitHub: A web-based hosting service for software development and version control using Git. Acquired by Microsoft in 2018.Training: Instruction to develop new skills.
42 questions
0 comments No comments
{count} votes

1 answer

Sort by: Most helpful
  1. Grmacjon-MSFT 17,876 Reputation points
    2024-04-09T20:56:48.5233333+00:00

    Hi @Asim Mahmood Khan we are sorry to hear you're facing this issue.

    you're seeing that error message because Azure App Service expects your code to be already present in the linked GitHub repository before it attempts deployment.

    Follow these steps to resolve this issue:

    • Make sure your Vue.js application code is committed and staged locally using Git commands like git add and git commit.
    • Push your local code to your remote GitHub repository using git push origin <branch_name>. Replace <branch_name> with the actual branch you want to deploy (e.g., main or master).
    • In the Azure portal, navigate to your Azure App Service deployment configuration.
    • Double-check that you've correctly linked your Azure App Service to the appropriate GitHub repository.
    • Ensure the deployment branch setting in Azure App Service matches the branch you pushed your code to in step 1.
    • Once you've pushed your code to GitHub, Azure App Service might not automatically pick up the changes immediately.
    • Consider navigating back to the deployment section in Azure App Service and manually triggering a deployment to initiate the process again.

    If the issue persists, you can try clearing the Azure App Service cache to force it to fetch the latest code from your GitHub repository. However, this is usually not necessary and should be attempted after verifying the above steps.

    Please let us know if you have further questions.

    -Grace

    1 person found this answer helpful.

Your answer

Answers can be marked as Accepted Answers by the question author, which helps users to know the answer solved the author's problem.