Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Addon-docs: Fix babel-loader resolution based on builder #16752

Merged
merged 4 commits into from
Jan 7, 2022
Merged

Addon-docs: Fix babel-loader resolution based on builder #16752

Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
e6dd29c
resolve the used builder in the webpack preset for docs, so we resolv…
ndelangen Nov 22, 2021
0d9f37b
fault tolerance when the user hasn't specified the core property at all
ndelangen Nov 22, 2021
3dfe130
fix review comment
ndelangen Jan 5, 2022
64cdf45
Merge branch 'next' into fix/15336-proper-relative-babelloader-webpack5
ndelangen Jan 5, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
22 changes: 17 additions & 5 deletions addons/docs/src/frameworks/common/preset.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,10 +4,7 @@ import remarkExternalLinks from 'remark-external-links';

// @ts-ignore
import { createCompiler } from '@storybook/csf-tools/mdx';

const resolvedBabelLoader = require.resolve('babel-loader', {
paths: [require.resolve('@storybook/builder-webpack4')], // FIXME!!!
});
import type { Options } from '@storybook/core-common';

// for frameworks that are not working with react, we need to configure
// the jsx to transpile mdx, for now there will be a flag for that
Expand All @@ -34,8 +31,23 @@ function createBabelOptions({ babelOptions, mdxBabelOptions, configureJSX }: Bab
};
}

export function webpack(webpackConfig: any = {}, options: any = {}) {
export async function webpack(
webpackConfig: any = {},
options: Options &
BabelParams & { sourceLoaderOptions: any; transcludeMarkdown: boolean } & Parameters<
typeof createCompiler
>[0]
) {
const { builder = 'webpack4' } = await options.presets.apply<{ builder: any }>('core', {} as any);

const resolvedBabelLoader = require.resolve('babel-loader', {
paths: builder.match(/(webpack4|webpack5)/)
? [require.resolve(`@storybook/builder-${builder}`)]
: [builder],
});

const { module = {} } = webpackConfig;

// it will reuse babel options that are already in use in storybook
// also, these babel options are chained with other presets.
const {
Expand Down