[Bug]: module is not defined with node 22

[husayt]

Environment

System:
    OS: Windows 10 10.0.19044
    CPU: (12) x64 Intel(R) Core(TM) i7-8700 CPU @ 3.20GHz
  Binaries:
    Node: 22.12.0 - C:\Program Files\nodejs\node.EXE
    npm: 10.9.0 - C:\Program Files\nodejs\npm.CMD <----- active
    pnpm: 9.15.0 - C:\Program Files\nodejs\pnpm.CMD
  Browsers:
    Chrome: 131.0.6778.140
    Edge: Chromium (131.0.2903.70)
  npmPackages:
    @storybook/addon-essentials: 8.4.7 => 8.4.7
    @storybook/addon-links: 8.4.7 => 8.4.7
    @storybook/blocks: 8.4.7 => 8.4.7
    @storybook/test: 8.4.7 => 8.4.7
    storybook: 8.4.7 => 8.4.7

Reproduction

https://new-storybook.netlify.app/

Describe the bug

With node 22 I get

Unhandled promise rejection: ReferenceError: module is not defined
    at file:/..node_modules/@storybook-vue/nuxt/preset.js:1:1

Workaround replace module.exports with export in preset.js in .node_modules/@storybook-vue/nuxt/preset.js

// module.exports = require('./dist/preset.cjs')
export * from './dist/preset.mjs';

Also, preset.js should not be used at all, there is just /preset does the proper mapping

Additional context

SB_CORE-SERVER_0002 (CriticalPresetLoadError): Storybook failed to load the following preset: @storybook-vue\nuxt\preset.

Please check whether your setup is correct, the Storybook dependencies (and their peer dependencies) are installed correctly and there are no package version clashes.

If you believe this is a bug, please open an issue on Github.

ReferenceError: module is not defined
    at file:///C:/,,,/node_modules/@storybook-vue/nuxt/preset.js:1:1
    at ModuleJobSync.runSync (node:internal/modules/esm/module_job:395:35)
    at ModuleLoader.importSyncForRequire (node:internal/modules/esm/loader:329:47)
    at loadESMFromCJS (node:internal/modules/cjs/loader:1414:24)
    at Module._compile (node:internal/modules/cjs/loader:1547:5)
    at node:internal/modules/cjs/loader:1677:16
    at Object.newLoader (.\node_modules\esbuild-register\dist\node.js:2262:9)
    at extensions..js (.\node_modules\esbuild-register\dist\node.js:4833:24)
    at Module.load (node:internal/modules/cjs/loader:1318:32)
    at Function._load (node:internal/modules/cjs/loader:1128:12)

More info:

    at loadPreset (.\node_modules\@storybook\core\dist\common\index.cjs:16477:13)

WARN Broken build, fix the error above.
WARN You may need to refresh the browser.

Unhandled promise rejection: ReferenceError: module is not defined

[husayt]

Workaround replace module.exports with export in preset.js in .node_modules/@storybook-vue/nuxt/preset.js

// module.exports = require('./dist/preset.cjs')
export * from './dist/preset.mjs';

Also, preset.js should not be used at all, there is just /preset does the proper mapping

[tobiasdiez]

Workaround replace module.exports with export in preset.js in .node_modules/@storybook-vue/nuxt/preset.js

// module.exports = require('./dist/preset.cjs')
export * from './dist/preset.mjs';

I think it's another instance where storybook has problems with esm. It's essentially the same error as in https://github.com/storybookjs/storybook/issues/30123. I think the preset.js file is supposed to look like this, see eg https://github.com/storybookjs/storybook/blob/next/code/renderers/vue3/preset.js.

Also, preset.js should not be used at all, there is just /preset does the proper mapping

I agree, but that's how storybook wants it. I've proposed to change this in https://github.com/storybookjs/storybook/discussions/30149.

[AndrewBogdanovTSS]

I'm getting this bug even with Node 20.19.2, so it's not limited only to Node 22

[shilman]

Storybook is going ESM only in SB10, which is already in beta. So perhaps a prerelease of @storybook-vue/nuxt targeting the beta would fix this? We're aiming for a full release in October. The focus of the major will be the shift to ESM only.