CLI Commands

Vite provides a command-line interface for development, building, and previewing your application.

Dev Server

vite

Start the Vite development server in the current directory.

vite

Aliases: vite dev, vite serve

Parameters

root

string

The root directory to serve. Defaults to current directory.

vite ./my-project

Command Options

--host

string

Specify the hostname for the server. Use 0.0.0.0 or true to listen on all addresses, including LAN and public addresses.

vite --host 0.0.0.0
vite --host

--port

number

Specify the port number. Default is 5173.

vite --port 3000

--open

boolean | string

Automatically open the app in the browser on server start. Can optionally specify a URL path.

vite --open
vite --open /docs/index.html

--cors

boolean

Enable CORS for the development server.

vite --cors

--strictPort

boolean

Exit if the specified port is already in use, instead of automatically trying the next available port.

vite --port 3000 --strictPort

--force

boolean

Force the optimizer to ignore the cache and re-bundle dependencies.

vite --force

--experimentalBundle

boolean

Enable experimental full bundle mode. This is highly experimental.

vite --experimentalBundle

Terminal Output

When starting the dev server, you’ll see output like:

  VITE v6.0.0  ready in 350 ms

  ➜  Local:   http://localhost:5173/
  ➜  Network: use --host to expose
  ➜  press h + enter to show help

CLI Shortcuts

While the dev server is running, you can use these keyboard shortcuts:

r + enter - Restart the server
u + enter - Show server URLs
o + enter - Open in browser
c + enter - Clear console
q + enter - Quit the server
h + enter - Show help

Build

vite build

Build your application for production.

vite build

Parameters

root

string

The root directory to build. Defaults to current directory.

vite build ./my-project

Command Options

--target

string

default:"baseline-widely-available"

Transpile target for the build. Determines browser compatibility.

vite build --target esnext
vite build --target chrome90

--outDir

string

default:"dist"

Output directory for the production build.

vite build --outDir build
vite build --outDir public/dist

--assetsDir

string

default:"assets"

Directory under outDir to place assets in.

vite build --assetsDir static

--assetsInlineLimit

number

default:4096

Static asset base64 inline threshold in bytes. Assets smaller than this will be inlined as base64.

vite build --assetsInlineLimit 8192
vite build --assetsInlineLimit 0  # disable inlining

--ssr

string

Build specified entry for server-side rendering.

vite build --ssr src/entry-server.js

--sourcemap

boolean | 'inline' | 'hidden'

default:false

Output source maps for the build.

true - Generate separate sourcemap files
'inline' - Inline sourcemaps in the output files
'hidden' - Generate sourcemaps but don’t reference them in files

vite build --sourcemap
vite build --sourcemap inline
vite build --sourcemap hidden

--minify

boolean | 'terser' | 'esbuild'

default:"esbuild"

Enable/disable minification, or specify the minifier to use.

vite build --minify terser
vite build --minify false

--manifest

boolean | string

Emit a manifest.json file in the output directory with a mapping of non-hashed asset filenames to their hashed versions.

vite build --manifest
vite build --manifest manifest.json
vite build --manifest .vite/manifest.json

--ssrManifest

boolean | string

Emit an SSR manifest file for determining style links and asset preload directives in production.

vite build --ssrManifest
vite build --ssrManifest ssr-manifest.json

--emptyOutDir

boolean

Force Vite to empty the output directory even if it’s outside of the project root. By default, Vite will warn and not empty it.

vite build --emptyOutDir

--watch

boolean

Enable watch mode. Rebuilds when modules have changed on disk.

vite build --watch

--app

boolean

Build all environments. Same as setting builder: {} in config. This is experimental.

vite build --app

Terminal Output

When building for production, you’ll see output like:

vite v6.0.0 building for production...
✓ 127 modules transformed.
dist/index.html                   0.45 kB │ gzip:  0.30 kB
dist/assets/index-DlrS5zTx.css    1.23 kB │ gzip:  0.61 kB
dist/assets/index-BN7I0VLa.js   143.48 kB │ gzip: 46.13 kB
✓ built in 1.25s

Preview

vite preview

Locally preview the production build. This command starts a static web server that serves the files from outDir (default: dist).

vite preview is intended for previewing the build locally and is not meant to be used as a production server.

vite preview

Parameters

root

string

The root directory containing the build. Defaults to current directory.

vite preview ./my-project

Command Options

--host

string

Specify the hostname for the preview server.

vite preview --host 0.0.0.0
vite preview --host

--port

number

Specify the port number. Default is 4173.

vite preview --port 8080

--strictPort

boolean

Exit if the specified port is already in use.

vite preview --port 8080 --strictPort

--open

boolean | string

Automatically open the app in the browser on server start.

vite preview --open
vite preview --open /about

--outDir

string

default:"dist"

Output directory to serve.

vite preview --outDir build

Terminal Output

When starting the preview server, you’ll see output like:

  ➜  Local:   http://localhost:4173/
  ➜  Network: use --host to expose
  ➜  press h + enter to show help

Optimize

vite optimize

Deprecated: The pre-bundle process runs automatically during development and does not need to be called manually.

Pre-bundle dependencies. This command was used to manually trigger dependency optimization, but it’s now done automatically when starting the dev server.

vite optimize

Parameters

root

string

The root directory. Defaults to current directory.

vite optimize ./my-project

Command Options

--force

boolean

Force the optimizer to ignore the cache and re-bundle dependencies.

vite optimize --force

NPM Scripts

Typical usage in package.json:

package.json

{
  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview"
  }
}

You can specify additional CLI options using flags:

package.json

{
  "scripts": {
    "dev": "vite --port 3000 --open",
    "build": "vite build --outDir build",
    "preview": "vite preview --port 8080"
  }
}

Then run:

npm run dev
npm run build
npm run preview

Getting Started

Core Concepts

Guides

CLI

CLI Commands

Dev Server

vite

Parameters

Command Options

Terminal Output

CLI Shortcuts

Build

vite build

Parameters

Command Options

Terminal Output

Preview

vite preview

Parameters

Command Options

Terminal Output

Optimize

vite optimize

Parameters

Command Options

NPM Scripts

Build docs developers (and LLMs) love

Getting Started

Core Concepts

Guides

CLI

​Dev Server

​vite

​Parameters

​Command Options

​Terminal Output

​CLI Shortcuts

​Build

​vite build

​Parameters

​Command Options

​Terminal Output

​Preview

​vite preview

​Parameters

​Command Options

​Terminal Output

​Optimize

​vite optimize

​Parameters

​Command Options

​NPM Scripts

Build docs developers (and LLMs) love

Dev Server

vite

Parameters

Command Options

Terminal Output

CLI Shortcuts

Build

vite build

Parameters

Command Options

Terminal Output

Preview

vite preview

Parameters

Command Options

Terminal Output

Optimize

vite optimize

Parameters

Command Options

NPM Scripts