JavaScript API

Vite JavaScript API TypeScript VS Code JS

`createServer`

async function createServer(inlineConfig?: InlineConfig): Promise<ViteDevServer>

import { createServer
 } from 'vite'

const server
 = await createServer
({
  //  `mode`  `configFile`
  configFile
: false,
  root
: import.meta.dirname
,
  server
: {
    port
: 1337,
  },
})
await server
.listen
()

server
.printUrls
()
server
.bindCLIShortcuts
({ print
: true })

Node.js createServer build process.env.NODE_ENV mode API process.env.NODE_ENV mode development API

WebSocket http middlewareMode

import http
 from 'http'
import { createServer
 } from 'vite'

const parentServer
 = http
.createServer
() // or express, koa, etc.

const vite
 = await createServer
({
  server
: {
    // 
    middlewareMode
: {
      //  http  WebSocket
      server
: parentServer
,
    },
    proxy
: {
      '/ws': {
        target
: 'ws://localhost:3000',
        // Proxying WebSocket
        ws
: true,
      },
    },
  },
})

parentServer
.use(vite
.middlewares
)

`InlineConfig`

InlineConfig UserConfig

configFileVite false

`ResolvedConfig`

ResolvedConfig UserConfig undefined

config.assetsInclude id
config.loggerVite

`ViteDevServer`

interface ViteDevServer {
  /**
   *  Vite 
   */
  config: ResolvedConfig
  /**
   *  connect 
   * - 
   * -  http 
       connect  Node.js 
   *
   * https://github.com/senchalabs/connect#use-middleware
   */
  middlewares: Connect.Server
  /**
   *  node http 
   */
  httpServer: http.Server | null
  /**
   * chokidar  `config.server.watch`  `null`
   *  `add`  `unwatch` 
   * https://github.com/paulmillr/chokidar/tree/3.6.0#api
   */
  watcher: FSWatcher
  /**
   * WebSocket  `send(payload)` 
   */
  ws: WebSocketServer
  /**
   * Rollup 
   */
  pluginContainer: PluginContainer
  /**
   * url  hmr 
   */
  moduleGraph: ModuleGraph
  /**
   * Vite  CLI  URL URL 
   *  `null`
   */
  resolvedUrls: ResolvedServerUrls | null
  /**
   *  URL 
   *  HTTP 
   */
  transformRequest(
    url: string,
    options?: TransformOptions,
  ): Promise<TransformResult | null>
  /**
   *  Vite  HTML  HTML 
   */
  transformIndexHtml(
    url: string,
    html: string,
    originalUrl?: string,
  ): Promise<string>
  /**
   *  URL  SSR 
   */
  ssrLoadModule(
    url: string,
    options?: { fixStacktrace?: boolean },
  ): Promise<Record<string, any>>
  /**
   *  ssr 
   */
  ssrFixStacktrace(e: Error): void
  /**
   *  HMR `server.moduleGraph`
   * API  `hmr`  `false`
   */
  reloadModule(module: ModuleNode): Promise<void>
  /**
   * 
   */
  listen(port?: number, isRestart?: boolean): Promise<ViteDevServer>
  /**
   * 
   *
   * @param forceOptimize -  --force 
   */
  restart(forceOptimize?: boolean): Promise<void>
  /**
   * 
   */
  close(): Promise<void>
  /**
   *  CLI 
   */
  bindCLIShortcuts(options?: BindCLIShortcutsOptions<ViteDevServer>): void
  /**
   *  `await server.waitForRequestsIdle(id)` 
   * 
   *  id 
   * 
   * @
   */
  waitForRequestsIdle: (ignoredId?: string) => Promise<void>
}

INFO

waitForRequestsIdle Vite Tailwind CSS HTTP1 http Vite Vite optimizeDeps.holdUntilCrawlEnd: false

`build`

async function build(
  inlineConfig?: InlineConfig,
): Promise<RolldownOutput | RolldownOutput[] | RolldownWatcher>

vite.config.js

import path from 'node:path'
import { build
 } from 'vite'

await build
({
  root
: path.resolve
(import.meta.dirname
, './project'),
  base
: '/foo/',
  build
: {
    rolldownOptions
: {
      // ...
    },
  },
})

`preview`

async function preview(inlineConfig?: InlineConfig): Promise<PreviewServer>

import { preview
 } from 'vite'

const previewServer
 = await preview
({
  //  `mode`  `configFile`
  preview
: {
    port
: 8080,
    open
: true,
  },
})

previewServer
.printUrls
()
previewServer
.bindCLIShortcuts
({ print
: true })

`PreviewServer`

interface PreviewServer {
  /**
   *  vite 
   */
  config: ResolvedConfig
  /**
   *  connect 
   * - 
   * -  HTTP 
   *    connect  Node.js 
   *
   * https://github.com/senchalabs/connect#use-middleware
   */
  middlewares: Connect.Server
  /**
   *  Node http 
   */
  httpServer: http.Server
  /**
   * Vite  CLI  URL URL 
   *  `null`
   */
  resolvedUrls: ResolvedServerUrls | null
  /**
   *  URL
   */
  printUrls(): void
  /**
   *  CLI 
   */
  bindCLIShortcuts(options?: BindCLIShortcutsOptions<PreviewServer>): void
}

`resolveConfig`

async function resolveConfig(
  inlineConfig: InlineConfig,
  command: 'build' | 'serve',
  defaultMode = 'development',
  defaultNodeEnv = 'development',
  isPreview = false,
): Promise<ResolvedConfig>

command serve build

`mergeConfig`

function mergeConfig(
  defaults: Record<string, any>,
  overrides: Record<string, any>,
  isRoot = true,
): Record<string, any>

isRoot Vite build false

overrides null undefined defaults mergeConfig

NOTE

mergeConfig mergeConfig

defineConfig

export default defineConfig
((configEnv
) =>
  mergeConfig
(configAsCallback
(configEnv
), configAsObject
),
)

`searchForWorkspaceRoot`

function searchForWorkspaceRoot(
  current: string,
  root = searchForPackageRoot(current),
): string

server.fs.allow

root

package.json workspaces
- lerna.json
- pnpm-workspace.yaml

`loadEnv`

function loadEnv(
  mode: string,
  envDir: string,
  prefixes: string | string[] = 'VITE_',
): Record<string, string>

.env

envDir .env process.env VITE_ prefixes

`normalizePath`

function normalizePath(id: string): string

Vite

`transformWithOxc`

async function transformWithOxc(
  code: string,
  filename: string,
  options?: OxcTransformOptions,
  inMap?: object,
): Promise<Omit<OxcTransformResult, 'errors'> & { warnings: string[] }>

Oxc Transformer JavaScript TypeScript Vite Oxc Transformer

`transformWithEsbuild`

async function transformWithEsbuild(
  code: string,
  filename: string,
  options?: EsbuildTransformOptions,
  inMap?: object,
): Promise<ESBuildTransformResult>

transformWithOxc

esbuild JavaScript TypeScript Vite esbuild

`loadConfigFromFile`

async function loadConfigFromFile(
  configEnv: ConfigEnv,
  configFile?: string,
  configRoot: string = process.cwd(),
  logLevel?: LogLevel,
  customLogger?: Logger,
): Promise<{
  path: string
  config: UserConfig
  dependencies: string[]
} | null>

Rolldown Vite

`preprocessCSS`

async function preprocessCSS(
  code: string,
  filename: string,
  config: ResolvedConfig,
): Promise<PreprocessCSSResult>

interface PreprocessCSSResult {
  code: string
  map?: SourceMapInput
  modules?: Record<string, string>
  deps?: Set<string>
}

.css.scss.sass.less.styl .stylus CSS CSS

filename filename .module.{ext} CSS module modules

url() image-set() URL

`version`

string

Vite "8.0.0"

`rolldownVersion`

string

Vite Rolldown "1.0.0" rolldown VERSION

`esbuildVersion`

string

`rollupVersion`

string