Skip to content

Conversation

@Han5991
Copy link
Contributor

@Han5991 Han5991 commented Jun 10, 2025

Description

This PR refactors the Storybook configuration to ensure compatibility with ECMAScript Modules (ESM). The changes include:

Changes Made

  • Updated imports: Changed path to node:path to use Node.js built-in module prefix
  • Added ESM compatibility: Introduced fileURLToPath and createRequire for proper ESM support
  • Replaced CommonJS methods: Updated require.resolve() to use ESM-compatible nodeRequire.resolve()
  • Enhanced path resolution: Added proper __filename and __dirname alternatives for ESM environment

Technical Details

  • Added ESM-compatible directory resolution using import.meta.url
  • Implemented CommonJS interoperability with createRequire
  • Maintained backward compatibility with fallback handling
  • Follows Node.js ESM best practices

Background

  • Node.js 20-22: Storybook configuration worked correctly
  • Node.js 23: ESM-related compatibility issues emerged
  • This PR specifically addresses the Node.js 23+ compatibility problems

Testing

  • ✅ Tested with Node.js 23 where the original issue was problematic
  • ✅ Confirmed Storybook configuration now works correctly with Node.js 23+
  • ✅ Maintains backward compatibility with Node.js 20-22

Future Compatibility

According to https://nodejs.org/en/about/previous-releases, Node.js 20 will reach End-of-Life soon, making these ESM improvements increasingly important for modern JavaScript environments.

Related Issue

Fixes storybookjs/storybook#30115

This ensures Storybook configuration works correctly in modern JavaScript environments while maintaining compatibility with existing tooling.

Han5991 added 2 commits June 11, 2025 07:37
Updated imports and path resolution to align with ES module standards, replacing CommonJS-specific methods. This ensures compatibility with modern JavaScript tooling while maintaining functionality.
@Han5991 Han5991 force-pushed the feature/fix-not-working-main.ts branch from 3b32ba1 to afbe48d Compare June 11, 2025 01:30
@rtivital rtivital added the ? label Jun 16, 2025
@Han5991
Copy link
Contributor Author

Han5991 commented Jun 17, 2025

Since Node.js 20 EOL is approaching, would it be worth upgrading to Node.js 24 LTS as well?

@rtivital
Copy link
Member

Currently, Mantine uses Node.js 22.11, the version is available in .nvmrc file. The 22 version is still relevant and can be used.

@Han5991
Copy link
Contributor Author

Han5991 commented Jun 17, 2025

Currently, Mantine uses Node.js 22.11, the version is available in .nvmrc file. The 22 version is still relevant and can be used.

Got it, thanks for pointing that out! Node.js 22.11 is indeed a solid choice.

@Han5991 Han5991 closed this Jun 17, 2025
@Han5991 Han5991 deleted the feature/fix-not-working-main.ts branch June 22, 2025 10:00
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Bug]: Storybook couldn't evaluate your .storybook/main.ts file

2 participants