new-hotness ESModules + nextjs 8 + typescript

[VienNguyen113]

Describe the bug
I have a project build up using nextjs v8 with typescript but I got a problem when importing apis from react-dnd 8.0.2

Screenshots
If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

• MacOS Mojave 10.14.5

Additional context

.babelrc:

 "presets": [
   "next/babel",
   "@zeit/next-typescript/babel",
 ],
}

dependencies:

    "@weco/next-plugin-transpile-modules": "^2.2.1",
    "next": "^8.1.0",
    "next-transpile-modules": "^2.3.1",
    "react": "^16.8.6",
    "react-dnd": "^8.0.2",
    "react-dnd-html5-backend": "^8.0.2",
    "react-dom": "^16.8.6"
  },
  "devDependencies": {
    "@zeit/next-css": "^1.0.1",
    "@zeit/next-sass": "^1.0.1",
    "@zeit/next-typescript": "^1.1.1",
    "next-compose-plugins": "^2.2.0",
    "webpack-merge": "^4.2.1"
  }

component:

import { DndProvider } from "react-dnd";
import HTML5Backend from "react-dnd-html5-backend";

function Home() {
  return (
    <DndProvider backend={HTML5Backend}>
      <div>Welcome to Next.js!</div>
    </DndProvider>
  );
}

export default Home;

[yunstanford]

+1, having the same issue.

[webberwang]

+1 same here

[yunstanford]

^ @darthtrevino

[darthtrevino]

The v8 libraries are using ES Modules by default. It sounds like you need to use the react-dnd-cjs library instead