当前位置：首页 > news >正文

Vue3 + Vite + TS,使用配置项目别名属性：server

news 来源：原创 2025/6/9 17:56:33

官网地址传送门

点哇点哇，vite 官网传送门

直接上马

server: {
   https: false, // 是否开启 https
   open: true, // 是否自动在浏览器中打开
   port: 8001, // 端口号
   host: "0.0.0.0",
   // 跨域代理
   proxy: {
     '/api': {
       target: "http://localhost:3000", // 后台接口
       changeOrigin: true,
       // secure: false, // 如果是https接口，需要配置这个参数
       // ws: true, //websocket支持
       // 截取api，并用api代替
       // rewrite: (path) => path.replace(/^\/api/, "/api"),
     }
   },
   hmr: {
     overlay: false, // 屏蔽服务器报错
   },
 }

proxy各种写法

// 字符串简写写法
'/foo': 'http://localhost:4567',
// 选项写法
'/api': {
  target: 'http://jsonplaceholder.typicode.com',
  changeOrigin: true,
  rewrite: (path) => path.replace(/^\/api/, '')
},
// 正则表达式写法
'^/fallback/.*': {
  target: 'http://jsonplaceholder.typicode.com',
  changeOrigin: true,
  rewrite: (path) => path.replace(/^\/fallback/, '')
},
// 使用 proxy 实例
'/api': {
  target: 'http://jsonplaceholder.typicode.com',
  changeOrigin: true,
  configure: (proxy, options) => {
    // proxy 是 'http-proxy' 的实例
  }
},
// Proxying websockets or socket.io
'/socket.io': {
  target: 'ws://localhost:3000',
  ws: true
}