swup swup Gia Plugin
GitHub swup on GitHub

Gia Plugin

A swup plugin for integrating Gia frontend components.

Automatically reloads components when required only for the replaced containers.

Installation

Install the plugin from npm and import it into your bundle.

npm install @swup/gia-plugin
npm install @swup/gia-plugin
import SwupGiaPlugin from '@swup/gia-plugin';
import SwupGiaPlugin from '@swup/gia-plugin';

Or include the minified production file from a CDN:

<script src="https://unpkg.com/@swup/gia-plugin@2"></script>
<script src="https://unpkg.com/@swup/gia-plugin@2"></script>

Usage

To run this plugin, include an instance in the swup options.

const swup = new Swup({
  plugins: [new SwupGiaPlugin()]
});
const swup = new Swup({
  plugins: [new SwupGiaPlugin()]
});

Options

components

Components to be used for mount/unmount. Defaults to an empty object.

import Component from 'gia/Component'

class ExampleComponent extends Component {
    // ...
}

const components = {
  ExampleComponent
}

const swup = new Swup({
  plugins: [new SwupGiaPlugin({ components })]
})
import Component from 'gia/Component'

class ExampleComponent extends Component {
    // ...
}

const components = {
  ExampleComponent
}

const swup = new Swup({
  plugins: [new SwupGiaPlugin({ components })]
})

firstLoad

Whether the components should be loaded on start. Defaults to true.

new SwupGiaPlugin({ firstLoad: true });
new SwupGiaPlugin({ firstLoad: true });

log

Let Gia report info on mounting/unmounting of components. Corresponds to setting the log variable of Gia's config). Defaults to false.

new SwupGiaPlugin({ log: false });
new SwupGiaPlugin({ log: false });