VuePress

Webpack

@vuepress/bundler-webpack

Webpack bundler is provided by @vuepress/bundler-webpackopen in new window package. It is a dependency of the vuepressopen in new window package, and you can also install it separately.

npm i -D @vuepress/bundler-webpack@next
1

Options

Reference of webpack bundler config, which can be set via bundlerConfig.

module.exports = {
  // when using vuepress package, you can omit this field
  // because webpack is the default bundler
  bundler: '@vuepress/bundler-webpack',
  // options for webpack bundler
  bundlerConfig: {
    // see below
  },
}
1
2
3
4
5
6
7
8
9
import type { WebpackBundlerOptions } from '@vuepress/bundler-webpack'
import { defineUserConfig } from '@vuepress/cli'
import type { DefaultThemeOptions } from '@vuepress/theme-default'

export default defineUserConfig<DefaultThemeOptions, WebpackBundlerOptions>({
  // when using vuepress package, you can omit this field
  // because webpack is the default bundler
  bundler: '@vuepress/bundler-webpack',
  // options for webpack bundler
  bundlerConfig: {
    // see below
  },
})
1
2
3
4
5
6
7
8
9
10
11
12
13

configureWebpack

  • Type: (config: WebpackConfiguration, isServer: boolean, isBuild: boolean) => WebpackConfiguration

  • Details:

    Edit the internal webpack config.

    This option accepts a function that will receive a webpack config object as the 1st argument, an isServer flag as the 2nd argument and an isBuild flag as the 3rd argument. You can either mutate the config directly, or return an object to be merged by webpack-mergeopen in new window.

chainWebpack

  • Type: (config: WebpackChainConfig, isServer: boolean, isBuild: boolean) => void

  • Details:

    Edit the internal webpack config with webpack-chainopen in new window.

    This option accepts a function that will receive a Config instance that provided by webpack-chain as the 1st argument an isServer flag as the 2nd argument and an isBuild flag as the 3rd argument.

beforeDevServer

afterDevServer

vue

postcss

stylus

scss

sass

less

evergreen

  • Type: boolean

  • Default: true

  • Details:

    Set to true if you are only targeting evergreen browsers. This will disable some transpilation and polyfills, and result in faster builds and smaller files.