Javascript NextJS ReferenceError:未定义元素

在我使用rollup.js捆绑了我的ReactJS组件之后，我尝试使用nextjs。 但nextjs会出现以下错误：

ReferenceError: Element is not defined

这是我的

rollup.config.js

const extensions = [".js", ".jsx", ".ts", ".tsx"];

export default {
  input: "./src/index.js",
  output: [
    {
      file: pkg.main,
      format: "cjs",
    },
    {
      file: pkg.module,
      format: "esm",
    },
  ],
  plugins: [
    external(),
    postcss({
      plugins: [
        simplevars(),
        cssvariables(),
        nested(),
        cssnext({ warnForDuplicates: false}),
        cssnano(),
      ],
      extensions: [".css"],
    }),
    babel({
      exclude: "node_modules/**",
      extensions,
    }),
    // Allows node_modules resolution
    resolve({
      mainFields: ["module", "main", "jsnext:main", "browser"],
      extensions,
    }),
    commonjs(),
    image(),
    visualizer(),
  ],
};

在reactjs应用程序中通常没有使用问题。但nextjs就是这样。我想可能是关于ssr的。但我不确定

如何修复此错误？ 是否需要更改

rollap.config.js

以消除此错误

谢谢