部署React(Vite)+Node.js单仓至Azure静态Web应用遇产物目录错误

核心问题 #

Azure Static Web Apps部署时的路径配置逻辑理解错误：app_artifact_location是相对于app_location的相对路径，而非项目根目录的绝对路径。你当前配置的frontend/dist/是从项目根目录出发的路径，但部署工具会在app_location（即./frontend）下寻找这个路径，自然找不到。

具体修正步骤 #

1. 调整Azure部署参数
   • 将app_artifact_location改为"dist"（因为app_location已经指向./frontend，所以直接写构建产物在该目录下的相对路径即可）
   • 由于你已经在前面的步骤手动执行了前端构建，把app_build_command设为空字符串""，避免Azure重复执行构建操作（重复构建可能引发环境依赖或路径解析问题）

修正后的部署步骤代码：

- 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.AZURE_TOKEN }}
    action: "upload"
    app_location: "./frontend"
    api_location: "backend"
    app_artifact_location: "dist"
    app_build_command: ""
    api_build_command: ""

2. 修正Vite入口路径（可选但推荐）
   你的Vite配置中rollupOptions.input用了绝对路径/src/main.jsx，在CI环境中可能出现路径解析异常。改为相对路径更稳妥：

export default defineConfig({
  build: {
    outDir: "dist",
    chunkSizeWarningLimit: 1000,
    manifest: true,
    rollupOptions: {
      input: "./src/main.jsx", // 改为相对路径
    },
  },
  plugins: [react()],
});

验证方法 #

重新触发GitHub Actions工作流，查看日志中Log frontend directory contents步骤的输出，确认frontend/dist目录存在且内容正常；再检查部署步骤是否能成功识别到产物目录。

内容的提问来源于stack exchange，提问作者Harun Abdi