Skip to content
Grok

Vite Preview Server API

Vite's Preview Server API ช่วยให้คุณกำหนดค่าการทำงานของเซิร์ฟเวอร์สำหรับการแสดงตัวอย่างแอปพลิเคชันที่ build แล้ว ซึ่งมีประโยชน์ในการทดสอบ production build ก่อนนำใช้งานจริง

preview.host

ระบุ host ที่จะใช้สำหรับ preview server ช่วยกำหนดว่าจะอนุญาตให้เข้าถึงจากเครือข่ายอื่นหรือเฉพาะเครื่อง ใช้ '0.0.0.0' เพื่ออนุญาตให้เข้าถึงจากเครือข่ายอื่น หรือ 'localhost' สำหรับเฉพาะเครื่อง

ts
import { defineConfig } from "vite";

export default defineConfig({
  preview: {
    host: "0.0.0.0", // อนุญาตให้เข้าถึงจากเครือข่ายอื่นได้
  },
});

preview.port

ระบุพอร์ตที่ใช้สำหรับ preview server ช่วยกำหนดพอร์ตเฉพาะเมื่อต้องการใช้งานพอร์ตที่แน่นอน ช่วยกำหนดพอร์ตเฉพาะเมื่อต้องการใช้งานพอร์ตที่แน่นอน

ts
import { defineConfig } from "vite";

export default defineConfig({
  preview: {
    port: 5000, // ระบุพอร์ตที่ต้องการ
    strictPort: true, // ไม่ให้เปลี่ยนพอร์ตอัตโนมัติ
  },
});

preview.https

เปิดใช้งาน HTTPS สำหรับ preview server จำเป็นเมื่อต้องการทดสอบในสภาพแวดล้อมที่ปลอดภัย จำเป็นเมื่อต้องการทดสอบในสภาพแวดล้อมที่ปลอดภัย

ts
import fs from "node:fs";
import { defineConfig } from "vite";

export default defineConfig({
  preview: {
    https: {
      key: fs.readFileSync("path/to/key.pem"),
      cert: fs.readFileSync("path/to/cert.pem"),
    },
  },
});

preview.proxy

กำหนดค่า proxy สำหรับ preview server ช่วยให้สามารถ redirect request ไปยังเซิร์ฟเวอร์อื่นได้ ช่วยให้สามารถ redirect request ไปยังเซิร์ฟเวอร์อื่นได้

ts
import { defineConfig } from "vite";

export default defineConfig({
  preview: {
    proxy: {
      "/api": {
        target: "http://localhost:3000",
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, ""),
      },
    },
  },
});