Allow use of ES Module for NextJS config

[Limpan]

Describe the bug

When trying to use storybook-addon-next I get the following error. I am using next.config.mjs.

info @storybook/react v6.5.16
info 
info => Loading presets
info Addon-docs: using MDX1
info => Using PostCSS preset with postcss@7.0.39
ERR! Error [ERR_REQUIRE_ESM]: require() of ES Module /workspaces/bytardag-t3/next.config.mjs not supported.
ERR! Instead change the require of /workspaces/bytardag-t3/next.config.mjs to a dynamic import() which is available in all CommonJS modules.
ERR!     at /workspaces/bytardag-t3/node_modules/storybook-addon-next/dist/config/webpack.js:18:168
ERR!  Error [ERR_REQUIRE_ESM]: require() of ES Module /workspaces/bytardag-t3/next.config.mjs not supported.
ERR! Instead change the require of /workspaces/bytardag-t3/next.config.mjs to a dynamic import() which is available in all CommonJS modules.
ERR!     at /workspaces/bytardag-t3/node_modules/storybook-addon-next/dist/config/webpack.js:18:168 {
ERR!   code: 'ERR_REQUIRE_ESM'
ERR! }

Your minimal, reproducible example

x

Steps to reproduce

1. Configure .storybook/main.js with the following addon object.

   // snip
   {
     name: "storybook-addon-next",
     options: {
       nextConfigPath: path.resolve(__dirname, "../next.config.mjs"),
     },
   },
   // snip

2. Start Storybook

Expected behavior

Expected storybook-addon-next to pick up my config but it fails.

How often does this bug happen?

Every time

Screenshots or Videos

No response

Platform

• Ubuntu 22.04 LTS
• Firefox

storybook-addon-next version

v1.7.1

Additional context

No response

[RyanClementsHax]

For now I don't support this. This addon is about to go into "keep the lights on" status because storybook is releasing their framework's api when storybook v7 gets released on march 14.

I recommend planning a migration to that, but please report any friction you encounter so we can help the whole ecosystem migrate smoothly :)