[vercel] react-vite vercel 간단 배포

 

 

 

vite.config.ts

import { defineConfig } from "vite";
import react from "@vitejs/plugin-react-swc";
import path from "path";

export default defineConfig({
  base: "/", // vercel 배포 main redirect
  plugins: [react()],
  resolve: {
    alias: {
      "@": path.resolve(__dirname, "./src"),
      "@public": path.resolve(__dirname, "./public"),
    },
  },
  build: {
    chunkSizeWarningLimit: 1000, // 임계값을 1000kB로 증가
    // vercel 배포 main redirect
    rollupOptions: {
      input: {
        main: "./index.html",
      },
      output: {
        entryFileNames: "[name].js",
        chunkFileNames: "[name].js",
        assetFileNames: "[name].[ext]", // 파일 이름과 확장자 설정
      },
    },
  },
});

outDir: "dist", // 빌드 디렉토리

---

vercel.json

{
  "rewrites": [{ "source": "/(.*)", "destination": "/index.html" }],
  "headers": [
    {
      "source": "/(.*).js",
      "headers": [
        {
          "key": "Content-Type",
          "value": "application/javascript"
        }
      ]
    }
  ]
}