RegExp for builder webpack5 for storybook not recognized properly

[creaux]

As soon as storybook configuration is structured by modules.

.
└── .storybook/
    ├── main.ts
    └── configuration/
        ├── index.ts
        └── core.config.ts

Where .storybook/configuration/core.config.ts could be like follows:

...
export const core: CoreConfig = { builder: 'webpack5' };
...

And .storybook/configuration/index.ts

import { core } from './core.config';
...
export const configuration: StorybookConfig = {
  core,
  ...
}

And .storybook/main.ts therefore:

import { configuration } from './configuration';

module.exports = configuration

The it doesn't work as following line is raw file reader and regexp.

nx/packages/storybook/src/executors/utils.ts

Line 117 in a32d46c

!storybookConfig.match(/builder: ('webpack5'|"webpack5"|`webpack5`)/g)

Workaround is to put core property directly in main.ts. But I think it shiould work in better way.

[mandarini]

Hi there @creaux ! Thanks for filing an issue! I am going to mark this as an enhancement. Although I understand the issues that this may cause to your setup, I still believe it's sort of a niche use-case. We are relying on a regex to determine the builder, as this seems to be the most efficient way to do it, since the Storybook configuration uses that syntax (builder: 'webpack5') to set the builder. We could potentially look at the imports into main.ts and then at the imports of the imports and so on, and look into every one of these files to see if there's a builder: 'webpack5', but I think this would not be very efficient. With the Nx plugins we are trying to cover all the use cases, if that's possible, and where this is not possible, we are at least trying to cover most use cases. Since this has an easy workaround, and the workaround is actually the most common syntax, then I think it makes sense to leave it aside for the time being.

That said, if you come up with a better/more efficient way to do this, let me know, and I can help you implement this, as a contribution! :) Thank you, again, very much for submitting this issue! :)

[mandarini]

Linking this here. I'll fix this soon!

[github-actions]

This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context.