Доступ из сети в Vite

Доступ из сети открывает страницу не только с этого компьютера, а с другого устройства в той же сети.

По умолчанию сервер слушает адрес, доступный как localhost. Другой телефон или ноутбук не увидит этот хост как этот компьютер. Поле server.host со значением true расширяет привязку: процесс принимает соединения и по сетевому интерфейсу. Добавим настройку рядом с уже знакомым портом 5173:

import { defineConfig } from 'vite'

export default defineConfig({
  server: {
    host: true,
  },
})

В точке входа оставим короткий текст, чтобы на экране было видно, что открыта та же сборка:

document.body.textContent = 'hello';

Выполним запуск сервера разработки и посмотрим строки в терминале:

npm run dev

Помимо http://localhost:5173 появится адрес с числом в локальной сети, например http://192.168.1.10:5173. Точные цифры зависят от настроек сети. Откроем этот URL на другом устройстве в той же Wi-Fi и увидим слово hello. Если страница не открывается, стоит проверить, не блокирует ли система входящие на порт 5173.

Откройте сервер для других устройств в той же сети, выведите на странице слово ready и запишите сетевой адрес, который напечатает терминал после запуска.

Откройте записанный адрес с телефона или другого компьютера в той же сети и убедитесь, что на экране видно слово ready.