Reactjs 如何在next.js web应用程序中实现OneSignal web推送？

在互联网上没有对上述问题的确切答案，所以问了这个问题。我试图在我的next.js web应用程序中实现OneSignal，但它在开发模式下返回各种错误

我做了什么？ 我制作了一个组件并导入react onesignal来初始化onesignal，并编写下面显示的代码

此外，我将服务人员文件放在公用文件夹中，并最终将上述组件导入pages文件夹中的

\u app.js

---

在执行上述过程后，我遇到了很多错误，如未定义选项，对象在react child中无效等。我应该如何使OneSignal正常工作？请给出这个问题的有效答案，这有助于像我这样的初级开发人员实现它。谢谢

您在哪里声明

选项

变量？为什么以这种方式导入模块

（等待导入（'react-onesignal'））.default

？使用next.js的动态功能基本上选项不是一个变量，它是react-oneSignal的初始化方法的参数，您可以在其文档中看到它。如果我是Wrong，请告诉我正确的方法，选项是一个应包含您的选项的变量，在这种情况下，未定义…好的，我将添加选项，第二个错误如何。并告诉我一件事，上面的函数中没有return语句。在没有return的情况下，它会工作吗。你能使它成为一个可行的组件吗？因为我尝试了许多方法使它工作，但没有成功

import React, { useEffect } from "react";
const initOneSignal = async () => {
    const OneSignal = (await import('react-onesignal')).default
    OneSignal.initialize('app id',options)

    useEffect(() => {
        initOneSignal()
      }, [])
  }


  export default initOneSignal;