fix(storybook-builder): simplify and speed up the CommonJS to ESM transformation

What I did

simplify and speed up the CommonJS to ESM transformation
make React conditional reexports work in production
remove @chialab/esbuild-plugin-commonjs and use low-level cjs-module-lexer

2nd caused a bug when I started working on MDX and created a static build of the storybook, which made React break with missing reexports like import { createContext } from 'react'; this was due to a lack of support in @chialab/esbuild-plugin-commonjs for conditional CommonJS reexports, specifically in this file https://www.runpkg.com/?react@18.2.0/index.js

// react@18.2.0/index.js
'use strict';

if (process.env.NODE_ENV === 'production') {
  module.exports = require('./cjs/react.production.min.js');
} else {
  module.exports = require('./cjs/react.development.js');
}

after hours of debugging, seeing the output of @chialab/esbuild-plugin-commonjs and trying to make a patch for it, I gave up an decided to try to make smth similar myself with the help of low-level tools, where https://www.npmjs.com/package/cjs-module-lexer seems to be the most mature and was used by @chialab/esbuild-plugin-commonjs under-the-hood

I think the end result is better than the previous in all aspects (simplicity, speed and the readability of the output) and it solves the bug of MDX which I'm working on in another branch

modernweb-dev / web

fix(storybook-builder): simplify and speed up the CommonJS to ESM transformation #2692

What I did

🦋 Changeset detected