[Bug]: Storybook hangs unless reactDocgen: false

[MIreland]

Version

System:
    OS: macOS 14.6.1
    CPU: (10) arm64 Apple M1 Max
    Memory: 35.30 MB / 32.00 GB
    Shell: 5.9 - /bin/zsh
  Browsers:
    Chrome: 131.0.6778.140
    Safari: 17.6
  npmPackages:
    storybook-react-rsbuild: ^0.1.6 => 0.1.6

Details

When running storybook, it never finishes building unless I use reactDocgen: false:

With DEBUG=*, I just see a ton of babel stuff:

Screen.Recording.2024-12-18.at.2.39.20.PM.mov

It appears to be related to the reactDocgen- when I set reactDocgen: false, storybook works fine.

Reproduce link

N/A

Reproduce Steps

I'm not sure how to best repro this.

[fi3ework]

I doubt it's a bug of react docgen but I'm not sure without reproduction. Could you helping test the doc that being generated with bisect to filter out what part caused the issue?

[MIreland]

Given that #199 has a reproduction and I don't, should we close this and reopen that one?

Could you helping test the doc that being generated with bisect to filter out what part caused the issue?

I'm not quite sure how to do that. The docgen works fine with vite storybook builder, but has never worked for storybook-rsbuild.

[fi3ework]

Given that #199 has a reproduction and I don't, should we close this and reopen that one?

#199 is resolved and closed, this one is still open due to no reproduction.

Given that #199 has a reproduction and I don't, should we close this and reopen that one?

At least provide some configurations or what not, the implementation is not the same even for vite builder and webpack builder of the official storybook builders.

[MIreland]

It was only closed as a duplicate of this one though? I don't think it was resolved.

main.js

module.exports = {
    stories: ['../src/**/*.stories.@(js|jsx|ts|tsx)'],
    addons: [
        '@storybook/addon-links',
        '@storybook/addon-essentials',
        '@storybook/addon-interactions',
        'storybook-addon-apollo-client',
    ],
    staticDirs: ['./public'],
    framework: 'storybook-react-rsbuild',
    rsbuildFinal: config => {
        return createStorybookConfig(config);
    },
    typescript: {
        reactDocgen: false,
    },
};

create-storybook-config.js

const { rsbuildPathAliases } = require('../frontend-path-aliases');

const { mergeRsbuildConfig } = require('@rsbuild/core');
// @ts-expect-error - This is a valid import
const { pluginNodePolyfill } = require('@rsbuild/plugin-node-polyfill');
// @ts-expect-error - This is a valid import
const { pluginReact } = require('@rsbuild/plugin-react');
const { StorybookPlugin, storybookBaseUrl } = require('./storybook-plugin');

/**
 * Customize the rsbuild config for Storybook
 * @param {import('@rsbuild/core').RsbuildConfig} baseConfig
 * @returns {import('@rsbuild/core').RsbuildConfig}
 */
const createStorybookConfig = baseConfig => {
    return mergeRsbuildConfig(baseConfig, {
        plugins: [pluginReact(), pluginNodePolyfill(), StorybookPlugin()],
        environments: {
            web: {
                source: {
                    alias: rsbuildPathAliases,
                },
            },
        },
        output: {
            distPath: {
                js: storybookBaseUrl,
                css: storybookBaseUrl,
            },
        },
    });
};

Where the aliases all look like this: '@orthly/items': resolve(repoRoot, './shared-libs/items/src/index.ts'),

[fi3ework]

It was only closed as a duplicate of this one though? I don't think it was resolved.

It is resolved. It's only similar to this one, not the same, or the two will be closed or leave opened together.

[fi3ework]

TBH, I can't see the weird config, I'm afraid you still need to bisect and report the problematic code. Sadly, I can't help out without a reproduction.