Search code examples
reactjslinuxazure-web-app-servicevite

Linux azure web app can't find assets files, React app


I'm deploying a React app to an Azure Web App on Linux. Node v20. In local, it runs ok. The release pipeline is working well. I've even deleted files via scm.azurewebsites.net/webssh/host and re-deploy, it works. But, when I try to navigate to my app, it does not load. It appears as if the site were new, with the Microsoft presentation page.

Then I tried to see advanced tools->site wwwroot but instead of reporting files on wwwroot directory, try to load my app with two errors on the browser develop tools console:

mysite.scm.azurewebsites.net/assets/index-Taz5NJvN.js net::ERR_ABORTED 404 (Not Found)

this is the wwwroot folder

I've noticed that it loads the index.html, because it changes the title of the web page, to my app title.

I've inspected /wwwroot directory via Azure -> development tools ->ssh and the assets directory contains those files.

I've been searching and googling but with no luck at all. I've used pm2 serve /home/site/wwwroot --no-daemon --spa and npx serve -s in the startup command also, the app was created with Vite. I would appreciate it if somebody could help me get this app running.


Solution

  • I created a sample vite+react application.

    Make sure you build your application before deploying it to azure app service

    npm run build

    After running above command, it generates dist folder, That contains everything needed to deploy your application to azure app service.

    • After deploying the app to azure app service even I faced the same issue with your startup command.

    • I configured the following startup command in the Configuration section of the Azure web app.

    pm2 serve /home/site/wwwroot/dist --no-daemon --spa
    

    enter image description here

    • You can find the deployed files in KUDU.

    enter image description here

    Output after deployment:

    enter image description here