Azure Static Web Apps deploying Vite app fails — JavaScript served as text/html (main.tsx MIME type error)

Question

I am deploying a Vite + React frontend to Azure Static Web Apps using GitHub Actions.

The deployment succeeds, but when visiting my site:

link removed

The browser shows a blank page, and DevTools logs:

main.tsx:1 Failed to load module script:
Expected a JavaScript-or-Wasm module script but the server responded with a MIME type of "text/html".
Strict MIME type checking is enforced for module scripts per HTML spec.

This means Azure is serving my compiled JS files as text/html instead of application/javascript.

---

My project structure

/
  public/
  src/
  dist/
     index.html
     assets/
     images/
     videos/

The dist/ folder is generated correctly by npm run build and contains the proper output.

---

My staticwebapp.config.json

Located at project root:

{
  "mimeTypes": {
    ".js": "text/javascript",
    ".mjs": "text/javascript",
    ".css": "text/css"
  },
  "routes": [
    {
      "route": "/*",
      "rewrite": "/index.html"
    }
  ]
}

---

My GitHub Actions workflow

name: Azure Static Web Apps CI/CD

on:
  push:
    branches: [ main ]
  pull_request:
    types: [opened, synchronize, reopened, closed]
    branches: [ main ]

jobs:
  build_and_deploy_job:
    if: github.event_name == 'push' || (github.event_name == 'pull_request' && github.event.action != 'closed')
    runs-on: ubuntu-latest

    steps:
      - name: Checkout code
        uses: actions/checkout@v4

      - name: Use Node.js 20
        uses: actions/setup-node@v4
        with:
          node-version: 20

      - name: Install dependencies
        run: npm ci

      - name: Build Vite App
        run: npm run build

      - name: Deploy to Azure Static Web Apps
        uses: Azure/static-web-apps-deploy@v1
        with:
          azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN }}
          repo_token: ${{ secrets.GITHUB_TOKEN }}
          action: "upload"
          app_location: "/"
          output_location: "dist"
          skip_app_build: true

---

What I have tried

✔ Verified dist/ exists and contains correct build ✔ Ensured workflow uses Node 20 ✔ Ensured staticwebapp.config.json is valid ✔ Removed app_location: "/" and tried "public" and "." ✔ Tried both skip_app_build: true and false

---

Problem

Azure continues to serve all JS files as:

Content-Type: text/html

even though valid MIME types are defined.

The app loads only a blank white page.

---

Question

How do I configure Azure Static Web Apps so that Vite-built JavaScript files under /dist are served with the correct MIME type (application/javascript) instead of text/html?