[Bug]:条件babel配置，如include和exclude在@storybook/next中被忽略,

2jcobegt 于 4个月前发布在 Babel

关注(0)|答案(3)|浏览(85)

描述bug

如果我在下一个babel配置中有条件配置，如include或exclude,那么这些行总是匹配到[root]/__fake__.js。
这种情况发生在以下代码中：
storybook/code/frameworks/nextjs/src/preset.ts
第59行至第69行的3a1e61c
| | exportconstbabel: PresetProperty<'babel'>=async(baseConfig: TransformOptions)=>{ |
| | constconfigPartial=loadPartialConfig({ |
| | ...baseConfig, |
| | filename: ${getProjectRoot()}/__fake__.js, |
| | }); |
| | |
| | constoptions=configPartial?.options; |
| | |
| | constisPresetConfigItem=(preset: any): preset is ConfigItem=>{ |
| | returntypeofpreset==='object'&&preset!==null&&'file'inpreset; |
| | }; |

复现链接

https://stackblitz.com/edit/github-iecdof?file=babel.config.js

复现步骤

打开故事按钮。
在控制台中查看async/await被转译，尽管我覆盖了babel-env为现代版本。

storybook

来源：https://github.com/storybookjs/storybook/issues/28467

3条答案

按热度按时间

lb3vh1jj1#

要解决条件性Babel配置(如include和exclude)被忽略的问题，请修改preset.ts中的babel函数以正确处理这些条件。具体来说，更新loadPartialConfig调用以尊重来自baseConfig的原始filename。

export const babel: PresetProperty<'babel'> = async (baseConfig: TransformOptions) => {
const configPartial = loadPartialConfig({
...baseConfig,
// Use the original filename from baseConfig instead of a fake one
filename: baseConfig.filename || ${getProjectRoot()}/__fake__.js,
});

const options = configPartial?.options;

// ... rest of the existing code
};


此更改确保使用原始文件名，从而允许在Babel配置中遵守`include`和`exclude`条件。

#### 参考文献

[/code/frameworks/nextjs/src/preset.ts](https://github.com/storybookjs/storybook/blob/next/code/frameworks/nextjs/src/preset.ts)
 [/code/frameworks/nextjs/src/babel](https://github.com/storybookjs/storybook/blob/next/code/frameworks/nextjs/src/babel)

##### 关于Greptile

此响应为您提供研究的起点，而非精确解决方案。
帮助我们改进！如果这有帮助，请留下一个👍，如果不相关，请留下一个👎。
[Ask Greptile](https://app.greptile.com/chat/github/storybookjs/storybook/next) · [Edit Issue Bot Settings](https://app.greptile.com/apps/github)

赞(0）回复(0）举报 4个月前

dfty9e192#

我可以处理这个吗？

赞(0）回复(0）举报 4个月前

4urapxun3#

当然可以！

赞(0）回复(0）举报 4个月前