NextJS 对 ESM 包使用“导入”

Question

我收到此错误：

Module not found: ESM packages (remark) need to be imported. Use 'import' to reference the package instead. https://nextjs.org/docs/messages/import-esm-externals
  2 | import path from 'path'
  3 | //import matter from 'gray-matter'
> 4 | import remark from 'remark'
    |                           ^
  5 | import html from 'remark-html'

即使模块已正确导入。

当我将其更改为不存在的名称时，我得到：

./lib/posts.js:4:28
Module not found: Can't resolve 'remarke'
  2 | import path from 'path'
  3 | //import matter from 'gray-matter'
> 4 | import remark from 'remarke'
    |                            ^
  5 | import html from 'remark-html'

所以我知道它是进口的。

我还尝试将其添加到 next.config.js：

experimental: {
        esmExternals: "loose",
    },

但后来我得到这个错误：

TypeError: (0 , _remark).default is not a function

这和remark库切换到ESM模块有关系。

有谁知道我可以做什么来消除这个错误？