Import ES module in Next.js

I came upon this error when trying to use ky in a Next.js project:

Error [ERR_REQUIRE_ESM]: Must use import to load ES Module: /foo/node_modules/ky/index.js

I think the problem is that Webpack (or Babel) is transforming all imports to require()s but ky is a pure ES module.

I got it working by dynamically importing ky before using it but it’s not elegant nor efficient.

const handleFormSubmit = async (event) => {
  const ky = (await import("ky")).default;

  const response = await ky
    .get('http://localhost/api/foo')
    .json();
};

Any suggestions?

106 thoughts on “Import ES module in Next.js”

  1. I just couldn’t leave your site before suggesting that I extremely loved the standard information a person supply on your guests? Is going to be back incessantly in order to check out new posts.

    Reply
  2. Pingback: cap ivermecta 6 mg
  3. Pingback: sildenafil drug

Leave a Comment