vitejs 使用 jsx 进行构建，在 aws amplify 上返回 MIME 错误

Question

所以我在一个 React 项目中使用 Vitejs。我对应用程序中的所有 React 文件使用 jsx 扩展。当使用 npm build 和 npm run Preview 时，应用程序在我的本地计算机上运行良好，但是当我使用 aws amplify 时，该页面给我一个 MIME 错误：

无法加载模块脚本：需要 JavaScript 模块脚本，但服务器以 MIME 类型“text/jsx”进行响应。根据 HTML 规范对模块脚本强制执行严格的 MIME 类型检查。

现在我尝试了很多 Vite 配置，但没有任何效果，这是我的配置文件

import { defineConfig } from 'vite';
import react from '@vitejs/plugin-react';
import fs from 'fs/promises';

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [react()],
  esbuild: {
    loader: 'jsx',
  },
  resolve: {
    alias: {
      './runtimeConfig': './runtimeConfig.browser',
    },
  },
  optimizeDeps: {
    esbuildOptions: {
      loader: {
        '.js': 'jsx',
      },
    },
  },
})

Answer 1

转到“构建设置”，单击“编辑”，然后更改行

baseDirectory: /

到

baseDirectory: /dist