Deploying static webpack to Azure App Service

Davy Raitt 30 Reputation points
2023-09-29T06:47:32.9166667+00:00

Hey all! Hope somebody can assist me! Facing a weird issue at the moment.

I have a app that I pack with webpack in my pipeline with the following command:

 ./node_modules/.bin/webpack --config webpack.dev.js  

After that I package the /dist/ folder like this:

 zip -r ../deployment-$BITBUCKET_BUILD_NUMBER.zip ./dist

This .zip consists of webpacked fiels and my index.html which is the entry point! And finally I deploy this .zip to the azure app service like this:

- pipe: microsoft/azure-web-apps-deploy:1.0.0 variables: 
AZURE_APP_ID: $AZURE_APP_ID 
AZURE_PASSWORD: $AZURE_PASSWORD 
AZURE_TENANT_ID: $AZURE_TENANT_ID 
AZURE_RESOURCE_GROUP: "${webAppName}-test-rg" 
AZURE_APP_NAME: "${webAppName}-test" 
ZIP_FILE: "deployment-$BITBUCKET_BUILD_NUMBER.zip"


The deployment succeeds but when I try and go to the app service url it says there is no content. I think I have to somehow point the app service to the index.html? But I don't know how. I tested the same deploy with a hello world Express example and this works! So the pipeline deploy and packaging seems to work. When I manually open the index.html in the dist folder after webpacking, this also works. So I am guessing the app service doesn't know what file to open, but as I read it it should know automatically. When I ssh into the server I can see my deployed files: GLN1o

Does anybody have a clue what I can change?

Azure App Service
Azure App Service
Azure App Service is a service used to create and deploy scalable, mission-critical web apps.
7,407 questions
0 comments No comments
{count} votes

1 answer

Sort by: Most helpful
  1. brtrach-MSFT 15,791 Reputation points Microsoft Employee
    2023-10-02T02:09:44.3766667+00:00

    @Davy Raitt Based on the information you provided, it seems like the deployment was successful, but you are not able to see the content when you go to the app service URL.

    You mentioned that you think you have to point the app service to the index.html file. That is correct! By default, Azure App Service looks for an index.html file in the root directory of your web app.

    Here are a few things you can try to resolve the issue:

    1. Make sure that the index.html file is in the root directory of your app. You can check this by SSHing into the server and navigating to the root directory of your app.
    2. Check the logs of your app service to see if there are any errors. You can do this by going to the Azure portal, selecting your app service, and then selecting "Log stream" under the "Monitoring" section.
    3. Try setting the "startup file" in the app service configuration to "index.html". You can do this by going to the Azure portal, selecting your app service, and then selecting "Configuration" under the "Settings" section. In the "General settings" tab, there should be a "Startup File" field where you can enter "index.html".

    Please try the three above solutions. If none of them bring you relief, reply to this message so we can assist you further.

    0 comments No comments