VuePressVuePress
  • Introduction
  • Getting Started
  • Configuration
  • Page
  • Markdown
  • Assets
  • I18n
  • Deployment
  • Theme
  • Plugin
  • Bundler
  • Migrating from v1
  • Troubleshooting
  • Core

    • CLI
    • Config
    • Frontmatter
    • Built-in Components
    • Plugin API
    • Theme API
    • Client API
    • Node API
  • Bundlers

    • Vite
    • Webpack
  • Ecosystem

    • Default Theme
    • Plugins
  • Advanced

    • Architecture
    • Writing a Plugin
    • Writing a Theme
    • Cookbook
  • Resources

    • Ecosystem
    • MarketPlace
    • Contributing Guide
  • Changelog
  • v1.x
  • v0.x
  • English
  • 简体中文
GitHub
  • Introduction
  • Getting Started
  • Configuration
  • Page
  • Markdown
  • Assets
  • I18n
  • Deployment
  • Theme
  • Plugin
  • Bundler
  • Migrating from v1
  • Troubleshooting
  • Core

    • CLI
    • Config
    • Frontmatter
    • Built-in Components
    • Plugin API
    • Theme API
    • Client API
    • Node API
  • Bundlers

    • Vite
    • Webpack
  • Ecosystem

    • Default Theme
    • Plugins
  • Advanced

    • Architecture
    • Writing a Plugin
    • Writing a Theme
    • Cookbook
  • Resources

    • Ecosystem
    • MarketPlace
    • Contributing Guide
  • Changelog
  • v1.x
  • v0.x
  • English
  • 简体中文
GitHub
  • Guide

    • Introduction
    • Getting Started
    • Configuration
    • Page
    • Markdown
    • Assets
    • I18n
    • Deployment
    • Theme
    • Plugin
    • Bundler
    • Migrating from v1
    • Troubleshooting

Bundler

VuePress supports using Webpack or Vite to dev and build sites. You can choose which bundler to use according to your preference, and no extra configuration is required.

Install a Bundler

When installing the vuepress package, no bundlers will be installed. You need to choose a bundler to install.

pnpm
# install vite bundler
pnpm add -D vuepress@next @vuepress/bundler-vite@next
# install webpack bundler
pnpm add -D vuepress@next @vuepress/bundler-webpack@next
yarn
# install vite bundler
yarn add -D vuepress@next @vuepress/bundler-vite@next
# install webpack bundler
yarn add -D vuepress@next @vuepress/bundler-webpack@next
npm
# install vite bundler
npm install -D vuepress@next @vuepress/bundler-vite@next
# install webpack bundler
npm install -D vuepress@next @vuepress/bundler-webpack@next

Use a Bundler

Generally, you could use a bundler without extra configuration, because we have already configured them properly to work with VuePress.

You can use a bundler via the bundler option:

import { viteBundler } from '@vuepress/bundler-vite'
// import { webpackBundler } from '@vuepress/bundler-webpack'

export default {
  bundler: viteBundler(),
  // bundler: webpackBundler(),
}

When you need to customize the bundler, you can set the corresponding options:

  • Bundlers > Vite
  • Bundlers > Webpack
Edit this page on GitHub
Last Updated:: 12/11/24, 4:33 AM
Contributors: meteorlxy, Mister-Hope
Prev
Plugin
Next
Migrating from v1