vite.config.ts配置Network: use --host to expose
时间: 2025-01-01 16:16:14 浏览: 38
### 配置 `vite.config.ts` 使用 `--host` 选项
为了使 Vite 开发服务器能够在局域网内被访问,可以在 `vite.config.ts` 文件中设置 `server.host` 属性为 `"0.0.0.0"` 或者 `true`。这允许外部设备通过 IP 地址连接到开发服务器。
```typescript
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
export default defineConfig({
server: {
host: "0.0.0.0", // 设置为 true 或 "0.0.0.0" 来启用网络访问[^1]
port: process.env.VITE_APP_PORT ? parseInt(process.env.VITE_APP_PORT, 10) : 3000,
strictPort: true,
proxy: {
'/api': {
target: process.env.VITE_APP_TARGET_URL || '',
changeOrigin: true,
rewrite: (path) => path.replace(/^\/api/, '')
}
}
},
})
```
当启动 Vite 的时候,默认情况下它会绑定到本地主机接口 (`localhost`) 上运行。但是通过上述配置可以改变这一行为,使得应用不仅限于本机访问而是开放给同一网络下的其他客户端访问[^2]。
此外,在生产环境中部署应用程序之前,请确保已经创建并正确设置了 `.env.production` 文件中的变量值以便覆盖默认端口和其他必要的配置项。
阅读全文