Error: Must use import to load ES Module

What version of Next.js are you using?

10.2.2

What version of Node.js are you using?

14.16.1

What browser are you using?

Edge

What operating system are you using?

Windows

How are you deploying your application?

local development

Describe the Bug

When importing the react-konva package I get this error

Server Error
Error: Must use import to load ES Module: C:\Users\bucsa\dev\atomic\node_modules\konva\lib\Core.js
require() of ES modules is not supported.
require() of C:\Users\bucsa\dev\atomic\node_modules\konva\lib\Core.js from C:\Users\bucsa\dev\atomic\node_modules\react-konva\lib\ReactKonvaCore.js is an ES module file as it is a .js file whose nearest parent package.json contains "type": "module" which defines all .js files in that package scope as ES modules.
Instead rename Core.js to end in .cjs, change the requiring code to use import(), or remove "type": "module" from C:\Users\bucsa\dev\atomic\node_modules\konva\package.json.

The same error was thrown when I tried to import the chessops library but managed to work around that by dynamically importing it when the component loads. Neither that nor importing with next/dynamic could solve the issue with this package though.

Expected Behavior

I expected the components to be imported and not throw an error.

To Reproduce

Install react-konva and konva

import { Stage } from 'react-konva'

const Example = () => {
  return <Stage></Stage>
}

[engelmav]

This actually happens intermittently with ReactMarkdown.

[sidwebworks]

Same issue, any updates?