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:

npm install -D vuepress

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

• JS
• TS

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:

npm install -D vuepress-vite

Next, you need to specify the name of the bundler to use in bundler option. Then you can set options of vite bundler via bundlerConfig option:

• JS
• TS

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
  },
})