Setup

yarn add nanno \
         pixi.js pixi.js-legacy \
         gsap fontfaceobserver
            

HTML

<div id="animation-container"></div>
<script src="/your-bundle.js"></script>
            

JavaScript

import * as PIXI from 'pixi.js';
import * as PIXILegacy from 'pixi.js-legacy';
import gsap from 'gsap';
import PixiPlugin from 'gsap/PixiPlugin';
import FontFaceObserver from 'fontfaceobserver';

import Nanno from 'nanno';

const nanno = new Nanno({
  pixi: PIXI, pixiLegacy: PIXILegacy,
  gsap, gsapPixiPlugin: PixiPlugin,
  font: FontFaceObserver,
});

nanno.renderFile(
  'animation-source.nn',
  document.getElementById('animation-container'),
);