Installation

There are two ways to install the package.

Bundler

If you're using a bundler in your project, install swup from npm:

npm install swup

In your application, import swup and create a new instance:

import Swup from 'swup';

const swup = new Swup({
  /* options */
});

CDN

If you're not using a bundler and want to get started quickly, you can include the minified production file from a CDN:

<script src="https://unpkg.com/swup@3"></script>

In your main script, create a new instance:

const swup = new Swup();

ESM

Swup and its plugins can be imported as ES modules for browsers that support it. The specifics differ depending on the CDN, but here's a pattern for including the ES module where supported, and falling back to a UMD version for older browsers. Note the ?module query string in the first import URL.

<!-- Import Swup as ESM -->

<script type="module">
  import Swup from 'https://unpkg.com/swup@3?module';
  const swup = new Swup();
</script>

<!-- Import Swup as UMD for older browsers -->

<script nomodule src="https://unpkg.com/swup@3"></script>
<script nomodule>
  const swup = new Swup();
</script>