javascript - 无法让 Barba JS 过渡以处理页面更改

Question

我正在尝试获取 Barba JS , 旁边是 GSAP ，在我的 React 上实现网站。
作为引用，我已经关注了这个 video tutorial here ，本教程当然不在React .
这是我的文件夹结构它展示了此过渡效果的所有相关文件:

theme
  public
    index.html
  src
    components
      Header
        Header.js
    pages
      Homepage
      Contact
    utils
      anim.js
      helpers.js
  App.js
  index.js

我安装了以下软件包:

gsap - 版本 3.8.0

@barba/core - 版本 2.9.7

当前结果

没有控制台错误，也没有编译错误。

切换页面时，没有过渡。感觉就像 barba未启动。

演示:
由于演示涉及一些文件，我创建了一个 codesandbox here .
编辑:
更新了我的 barba转换代码并添加了 debug: true .然后，将鼠标悬停在我的联系页面按钮上时，控制台显示错误: [@barba/core] Error: Fetch error at XMLHttpRequest.o.onerror ?

import { pageTransition } from "./helpers";
import barba from '@barba/core';

export function delay(n) {
  n = n || 2000;
  return new Promise((done) => {
    setTimeout(() => {
      done();
    }, n);
  });
}

barba.init({
  debug: true,
  sync: true,
  transitions: [
    {
      async leave(data){
        const done = this.async();
        pageTransition();
        await delay(1000);
        done();
      }
    }
  ]
});

Answer 1

很难说，但你可以设置 debug: true，在 barba 的初始化中，所以它会吐出发生了什么的日志；)
barba.init({
调试:是的，
同步:假，
//查看 das 页面
意见:[{.....