# Using a Plugin

You can use plugins by doing some configuration at .vuepress/config.js:

module.exports = {
  plugins: [
    require('./my-plugin.js')
  ]
}

# Use plugins from a dependency

A plugin can be published on npm in CommonJS format as vuepress-plugin-xxx. You can use it:

module.exports = {
  plugins: [ 'vuepress-plugin-xxx' ]
}

# Plugin Shorthand

If you prefix the plugin with vuepress-plugin-, you can use a shorthand to leave out that prefix:

module.exports = {
  plugins: [ 'xxx' ]
}

Same with:

module.exports = {
  plugins: [ 'vuepress-plugin-xxx' ]
}

This also works with Scoped Packages (opens new window):

module.exports = {
  plugins: [ '@org/vuepress-plugin-xxx', '@vuepress/plugin-xxx' ]
}

Shorthand:

module.exports = {
  plugins: [ '@org/xxx', '@vuepress/xxx' ]
}

Note

The plugin whose name starts with @vuepress/plugin- is an officially maintained plugin.

# Plugin options

# Babel Style

Plugins can have options specified by wrapping the name and an options object in an array inside your config:

module.exports = {
  plugins: [
    [
      'vuepress-plugin-xxx',
      { /* options */ }
    ]
  ]
}

Since this style is consistent with babel’s Plugin/Preset Options (opens new window), we call it Babel Style.

# Object Style

VuePress also provides a simpler way to use plugins from a dependency:

module.exports = {
  plugins: {
    'xxx': { /* options */ }
  }
}

Note

The plugin can be disabled when false is explicitly passed as option.

  • Babel style
module.exports = {
  plugins: [
    [ 'xxx', false ] // disabled.
  ]
}
  • Object style
module.exports = {
  plugins: {
    'xxx': false // disabled.
  }
}