Config File

Config File Resolving

When running vite from the command line, Vite will automatically try to resolve a config file named vite.config.js inside project root.

The most basic config file looks like this:

  1. // vite.config.js
  2. export default {
  3.   // config options
  4. }

Note Vite supports using ES modules syntax in the config file even if the project is not using native Node ESM via type: "module". In this case the config file is auto pre-processed before load.

You can also explicitly specify a config file to use with the --config CLI option (resolved relative to cwd):

  1. vite --config my-config.js

Config Intellisense

Since Vite ships with TypeScript typings, you can leverage your IDE’s intellisense with jsdoc type hints:

  1. /**
  2.  * type {import('vite').UserConfig}
  3.  */
  4. export default {
  5.   // ...
  6. }

Vite also directly supports TS config files. You can use vite.config.ts instead:

  1. import { defineConfig } from 'vite'
  3. export default defineConfig({
  4.   // ...
  5. })

Conditional Config

If the config needs to conditional determine options based on the command (serve or build) or the mode being used, it can export a function instead:

  1. export default ({ command, mode }) => {
  2.   if (command === 'serve') {
  3.     return {
  4.       // serve specific config
  5.     }
  6.   } else {
  7.     return {
  8.       // build specific config
  9.     }
  10.   }
  11. }