Параметры сервера #

server.host #

• Тип: string | boolean
• По умолчанию: 'localhost'

Укажите, какие IP-адреса сервер должен прослушивать. Установите для этого параметра значение 0.0.0.0 или true, чтобы прослушивать все адреса, включая локальные и общедоступные адреса.

Это можно установить через CLI, используя --host 0.0.0.0 или --host.

// vite.config.js
import { defineConfig } from 'vite'
import dns from 'dns'

dns.setDefaultResultOrder('verbatim')

export default defineConfig({
  // omit
})

server.port #

• Тип: number
• По умолчанию: 5173

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

server.strictPort #

• Тип: boolean

Установите значение true, чтобы выйти, если порт уже используется, вместо того, чтобы автоматически пытаться использовать следующий доступный порт.

server.https #

• Тип: boolean | https.ServerOptions

Включите TLS + HTTP/2. Обратите внимание, что переход на TLS происходит только в том случае, если также используется опция server.proxy.

Значение также может быть объектом параметров, переданным в https.createServer().

Нужен действующий сертификат. Для базовой настройки вы можете добавить @vitejs/plugin-basic-ssl в плагины проекта, которые будут автоматически создавать и кэшировать собственный -подписанный сертификат. Но мы рекомендуем создавать собственные сертификаты.

server.open #

• Тип: boolean | string

Автоматически открывать приложение в браузере при запуске сервера. Когда значение представляет собой строку, оно будет использоваться в качестве имени пути URL-адреса. Если вы хотите открыть сервер в определенном браузере, который вам нравится, вы можете установить env process.env.BROWSER (например, firefox). Подробнее смотрите пакет open.

Пример:

export default defineConfig({
  server: {
    open: '/docs/index.html'
  }
})

server.proxy #

• Тип: Record<string, string | ProxyOptions>

Настройте пользовательские правила прокси для сервера разработки. Ожидает объект пар { key: options }. Если ключ начинается с ^, он будет интерпретирован как RegExp. Параметр configure можно использовать для доступа к экземпляру прокси.

Использует http-proxy. Полные параметры здесь.

В некоторых случаях вы также можете настроить базовый сервер разработки (например, чтобы добавить настраиваемый мидлвар во внутреннее приложение connect). Для этого вам нужно написать свой собственный плагин и использовать функцию configureServer.

Пример:

export default defineConfig({
  server: {
    proxy: {
      // string shorthand
      '/foo': 'http://localhost:4567',
      // with options
      '/api': {
        target: 'http://jsonplaceholder.typicode.com',
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, '')
      },
      // with RegEx
      '^/fallback/.*': {
        target: 'http://jsonplaceholder.typicode.com',
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/fallback/, '')
      },
      // Using the proxy instance
      '/api': {
        target: 'http://jsonplaceholder.typicode.com',
        changeOrigin: true,
        configure: (proxy, options) => {
          // proxy will be an instance of 'http-proxy'
        }
      },
      // Proxying websockets or socket.io
      '/socket.io': {
        target: 'ws://localhost:5173',
        ws: true
      }
    }
  }
})

server.cors #

• Тип: boolean | CorsOptions

Настройте CORS для сервера разработки. Это включено по умолчанию и позволяет любое происхождение. Передайте объект опций, чтобы точно настроить поведение, или false, чтобы отключить.

server.headers #

• Тип: OutgoingHttpHeaders

Укажите заголовки ответа сервера.

server.hmr #

• Тип: boolean | { protocol?: string, host?: string, port?: number, path?: string, timeout?: number, overlay?: boolean, clientPort?: number, server?: Server }

Отключите или настройте соединение HMR (в случаях, когда веб-сокет HMR должен использовать адрес, отличный от http-сервера).

Установите для server.hmr.overlay значение false, чтобы отключить наложение ошибок сервера.

clientPort — это расширенный параметр, который переопределяет порт только на стороне клиента, позволяя вам обслуживать веб-сокет на порту, отличном от того, который ищет клиентский код.

Когда server.hmr.server определен, Vite будет обрабатывать запросы на подключение HMR через предоставленный сервер. Если не в режиме промежуточного программного обеспечения, Vite попытается обработать запросы на подключение HMR через существующий сервер. Это может быть полезно при использовании самозаверяющих сертификатов или когда вы хотите открыть Vite по сети на одном порту.

Посмотрите vite-setup-catalogue для некоторых примеров.

Отказ от прямого подключения к веб-сокету. Проверьте https://vitejs.ru/config/server-options.html#server-hmr , чтобы удалить предыдущую ошибку подключения.

server.watch #

• Тип: object

Параметры наблюдателя файловой системы для передачи chokidar.

Наблюдатель сервера Vite по умолчанию пропускает каталоги .git/ и node_modules/. Если вы хотите просмотреть пакет внутри node_modules/, вы можете передать отрицательный шаблон glob в server.watch.ignored. То есть:

export default defineConfig({
  server: {
    watch: {
      ignored: ['!**/node_modules/your-package-name/**']
    }
  },
  // The watched package must be excluded from optimization,
  // so that it can appear in the dependency graph and trigger hot reload.
  optimizeDeps: {
    exclude: ['your-package-name']
  }
})

server.middlewareMode #

• Тип: boolean
• По умолчанию: false

Создайте сервер Vite в режиме мидлвара.

• Связанный: appType, SSR — настройка сервера разработки

• Пример:

import express from 'express'
import { createServer as createViteServer } from 'vite'

async function createServer() {
  const app = express()

  // Create Vite server in middleware mode
  const vite = await createViteServer({
    server: { middlewareMode: true },
    appТип: 'custom' // don't include Vite's default HTML handling middlewares
  })
  // Use vite's connect instance as middleware
  app.use(vite.middlewares)

  app.use('*', async (req, res) => {
    // Since `appType` is `'custom'`, should serve response here.
    // Note: if `appType` is `'spa'` or `'mpa'`, Vite includes middlewares to handle
    // HTML requests and 404s so user middlewares should be added
    // before Vite's middlewares to take effect instead
  })
}

createServer()

server.base #

• Тип: string | undefined

Добавляйте эту папку в HTTP-запросы для использования при проксировании vite в качестве подпапки. Должен начинаться и заканчиваться символом /.

server.fs.strict #

• Тип: boolean
• По умолчанию: true (enabled by default since Vite 2.7)

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

server.fs.allow #

• Тип: string[]

Ограничить файлы, которые можно обслуживать через /@fs/. Когда для server.fs.strict установлено значение true, доступ к файлам за пределами этого списка каталогов, которые не импортированы из разрешенного файла, приведет к ошибке 403.

Vite будет искать корень потенциального рабочего пространства и использовать его по умолчанию. Действительная рабочая область соответствует следующим условиям, в противном случае будет использоваться корень проекта.

• содержит поле workspaces в package.json
• содержит один из следующих файлов
  • lerna.json
  • pnpm-workspace.yaml

Принимает путь для указания пользовательского корня рабочей области. Это может быть абсолютный путь или путь относительно корня проекта. Для примера:

export default defineConfig({
  server: {
    fs: {
      // Allow serving files from one level up to the project root
      allow: ['..']
    }
  }
})

Когда указан server.fs.allow, автоматическое обнаружение корня рабочей области будет отключено. Чтобы расширить исходное поведение, предоставляется утилита searchForWorkspaceRoot:

import { defineConfig, searchForWorkspaceRoot } from 'vite'

export default defineConfig({
  server: {
    fs: {
      allow: [
        // search up for workspace root
        searchForWorkspaceRoot(process.cwd()),
        // your custom rules
        '/path/to/custom/allow'
      ]
    }
  }
})

server.fs.deny #

• Тип: string[]
• По умолчанию: ['.env', '.env.*', '*.{pem,crt}'].

Черный список для конфиденциальных файлов, обслуживание которых ограничено сервером Vite dev. Это будет иметь более высокий приоритет, чем server.fs.allow. Поддерживаются шаблоны picomatch.

server.origin #

• Тип: string

Определяет источник сгенерированных URL-адресов активов во время разработки.

export default defineConfig({
  server: {
    origin: 'http://127.0.0.1:8080'
  }
})