NextJs React-Quill 动态导入不起作用我该如何解决这个问题？

Question

我将 NextJs 与 React-Quill 一起使用，但出现错误。

错误：-错误-unhandledRejection：ReferenceError：文档未定义 在对象。 ode_modules\quill\dist\quill.js:7661:12)

当我进行研究时，他们说使用动态导入来解决这个问题。但动态也不起作用。

动态导入不起作用，还有其他解决方案吗？

我也尝试 _app js 文件夹条件渲染（typeof window !==“undefined”）不起作用。

我的代码在这里>

import React from 'react';
import { getSession } from 'next-auth/react';
import dynamic from 'next/dynamic';

const ReactQuill = dynamic(import('react-quill'), {
  ssr: false,
  loading: () => <p>Loading ...</p>,
});

function EditService() {
  return <ReactQuill />;
}

export async function getServerSideProps(context) {
  const session = await getSession({ req: context.req });

  if (!session) {
    return {
      redirect: {
        destination: '/',
        permanent: false,
      },
    };
  }
  return {
    props: {},
  };
}

export default EditService;

Answer 1

尝试像这样导入：

const ReactQuill = dynamic(() => import('react-quill'), {
  ssr: false,
  loading: () => <p>Loading ...</p>,
});