Bundler

VuePress has been using webpackopen in new window as the bundler to dev and build sites. Since VuePress v2, other tools like Viteopen in new window are also supported.

Although it is possible to create other bundler packages by community users, currently we only suggest to use the bundlers provided by VuePress team.

Webpack

When using the vuepressopen in new window package, the webpack bundler is installed:

yarn add -D vuepress@next

npm install -D vuepress@next

You can specify the name of the bundler to use in bundler option, or omit it because webpack is the default bundler when using vuepress package. Then you can set options of webpack bundler via bundlerConfig option:

module.exports = {
  bundler: '@vuepress/webpack',
  bundlerConfig: {
    // webpack bundler options
  },
}

import { defineUserConfig } from 'vuepress'
import type { DefaultThemeOptions, WebpackBundlerOptions } from 'vuepress'

export default defineUserConfig<DefaultThemeOptions, WebpackBundlerOptions>({
  bundler: '@vuepress/webpack',
  bundlerConfig: {
    // webpack bundler options
  },
})

Vite

If you want to use Vite instead, you can switch to vuepress-viteopen in new window package:

yarn add -D vuepress-vite@next

npm install -D vuepress-vite@next

You can specify the name of the bundler to use in bundler option, or omit it because vite is the default bundler when using vuepress-vite package. Then you can set options of vite bundler via bundlerConfig option:

module.exports = {
  bundler: '@vuepress/vite',
  bundlerConfig: {
    // vite bundler options
  },
}

import { defineUserConfig } from 'vuepress-vite'
import type { DefaultThemeOptions, ViteBundlerOptions } from 'vuepress-vite'

export default defineUserConfig<DefaultThemeOptions, ViteBundlerOptions>({
  bundler: '@vuepress/vite',
  bundlerConfig: {
    // vite bundler options
  },
})