Plugins

Barba plugins are components that you can plug to improve the default library behavior.

Available

Here is the list of all available plugins for Barba:

  • @barba/router → allows you to use custom routes for page transitions
  • @barba/prefetch → prefetches automatically and cache your pages
  • @barba/css → a style helper that manage you CSS classes during transitions
  • @barba/head → keep your <head> up to date (coming soon)
  • @barba/preset → ready-to-use basic transitions pack (coming soon)

Usage

To use a plugin, simply tell Barba what plugin(s) you want to use before initialize it:

1
2
3
4
5
6
7
8
9
10
import barba from '@barba/core';
import prefetch from '@barba/prefetch';

// tell Barba what plugins to use
barba.use(prefetch);

// init Barba
barba.init({
...
});