GatsbyJS - 未定义构建显示错误 window (AOS)

Question

我是 GatsbyJS 和 ReactJS 的新手，在构建项目时遇到问题。问题是每当我在其中构建带有 AOS 的项目时，它都会显示错误 window 未定义。我运行在开发模式下完全没问题。

这是我的代码：

我读到 componentDidMount() 应该可以解决问题。不幸的是，它对我不起作用。

有什么帮助吗？谢谢..

Answer 1

我将代码更改为：

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();
    }
}

删除了顶部的 import AOS from "aos"，对我来说一切正常。

GatsbyJS - 未定义构建显示错误 window (AOS)

GatsbyJS - build show error window is not defined (AOS)

javascript

animate.css

reactjs

gatsby