Javascript GatsbyJS-未定义生成显示错误窗口（AOS）

我对盖茨比JS和ReactJS是新手，我在构建项目时遇到了一个问题。 问题是，每当我构建包含AOS的项目时，都会显示未定义错误窗口。当我在开发模式下运行时，它是完全好的

这是我的代码：

我读到componentDidMount（）应该可以解决这个问题。不幸的是，它对我不起作用

有什么帮助吗？谢谢..

我将代码更改为：

import React from "react";
import Link from "gatsby-link";

import whiteLogo from "../img/tm_logo_white.png";
import myImg from "../img/me.jpg";

class IndexPage extends React.Component {

    componentDidMount() {
        const isBrowser = typeof window !== "undefined";
        const AOS = isBrowser ? require("aos") : undefined;

        this.aos = AOS;
        this.aos.init();
    }

    componentDidUpdate() {
        this.aos.refresh();
    }
}

---

从顶部的“AOS”中删除

导入AOS

，一切对我来说都很好。

不错，但将来可能会使用代码而不是图像！