diff --git a/addons/docs/README.md b/addons/docs/README.md index a293422d9f4..4c0a03c1db9 100644 --- a/addons/docs/README.md +++ b/addons/docs/README.md @@ -103,10 +103,10 @@ First add the package. Make sure that the versions for your `@storybook/*` packa yarn add -D @storybook/addon-docs ``` -Docs has peer dependencies on `react` and `babel-loader`. If you want to write stories in MDX, you may need to add these dependencies as well: +Docs has peer dependencies on `react`. If you want to write stories in MDX, you may need to add this dependency as well: ```sh -yarn add -D react babel-loader +yarn add -D react ``` Then add the following to your `.storybook/main.js`: @@ -183,7 +183,8 @@ module.exports = { test: /\.(stories|story)\.mdx$/, use: [ { - loader: 'babel-loader', + // Need to add babel-loader as dependency: `yarn add -D babel-loader` + loader: require.resolve('babel-loader'), // may or may not need this line depending on your app's setup options: { plugins: ['@babel/plugin-transform-react-jsx'], diff --git a/addons/docs/angular/README.md b/addons/docs/angular/README.md index 1485fb4a48b..df7c132bc4a 100644 --- a/addons/docs/angular/README.md +++ b/addons/docs/angular/README.md @@ -96,10 +96,10 @@ storiesOf('App Component', module) [MDX](../docs/mdx.md) is a convenient way to document your components in Markdown and embed documentation components, such as stories and props tables, inline. -Docs has peer dependencies on `react` and `babel-loader`. If you want to write stories in MDX, you'll need to add these dependencies as well: +Docs has peer dependencies on `react`. If you want to write stories in MDX, you may need to add this dependency as well: ```sh -yarn add -D react babel-loader +yarn add -D react ``` Then update your `.storybook/main.js` to make sure you load MDX files: diff --git a/addons/docs/common/README.md b/addons/docs/common/README.md index 45f400ea2a4..824912a56d6 100644 --- a/addons/docs/common/README.md +++ b/addons/docs/common/README.md @@ -34,10 +34,10 @@ When you [install docs](#installation) you should get basic [DocsPage](../docs/d [MDX](../docs/mdx.md) is a convenient way to document your components in Markdown and embed documentation components, such as stories and props tables, inline. -Docs has peer dependencies on `react` and `babel-loader`. If you want to write stories in MDX, you'll need to add these dependencies as well: +Docs has peer dependencies on `react`. If you want to write stories in MDX, you may need to add this dependency as well: ```sh -yarn add -D react babel-loader +yarn add -D react ``` Then update your `.storybook/main.js` to make sure you load MDX files: diff --git a/addons/docs/ember/README.md b/addons/docs/ember/README.md index dce27987fe8..adc2a79e5ff 100644 --- a/addons/docs/ember/README.md +++ b/addons/docs/ember/README.md @@ -78,10 +78,10 @@ storiesOf('App Component', module) [MDX](../docs/mdx.md) is a convenient way to document your components in Markdown and embed documentation components, such as stories and props tables, inline. -Docs has peer dependencies on `react` and `babel-loader`. If you want to write stories in MDX, you'll need to add these dependencies as well: +Docs has peer dependencies on `react`. If you want to write stories in MDX, you may need to add this dependency as well: ```sh -yarn add -D react babel-loader +yarn add -D react ``` Then update your `.storybook/main.js` to make sure you load MDX files: diff --git a/addons/docs/package.json b/addons/docs/package.json index 02c0c7dfb4c..71c49e8a5e3 100644 --- a/addons/docs/package.json +++ b/addons/docs/package.json @@ -134,12 +134,10 @@ "zone.js": "^0.11.3" }, "peerDependencies": { - "@babel/core": "^7.11.5", "@storybook/angular": "6.3.0-alpha.13", "@storybook/vue": "6.3.0-alpha.13", "@storybook/vue3": "6.3.0-alpha.13", "@storybook/web-components": "6.3.0-alpha.13", - "babel-loader": "^8.0.0", "lit-html": "^1.0.0", "react": "^16.8.0 || ^17.0.0", "react-dom": "^16.8.0 || ^17.0.0", diff --git a/addons/docs/react/README.md b/addons/docs/react/README.md index d8ef563331d..0ce4cba1a91 100644 --- a/addons/docs/react/README.md +++ b/addons/docs/react/README.md @@ -67,12 +67,6 @@ storiesOf('InfoButton', module) [MDX](../docs/mdx.md) is a convenient way to document your components in Markdown and embed documentation components, such as stories and props tables, inline. -Docs has peer dependencies on `react` and `babel-loader`. If you want to write stories in MDX, you may need to add these dependencies as well: - -```sh -yarn add -D react babel-loader -``` - Then update your `.storybook/main.js` to make sure you load MDX files: ```js diff --git a/addons/docs/vue/README.md b/addons/docs/vue/README.md index 2a3dd63613d..d335b897fb4 100644 --- a/addons/docs/vue/README.md +++ b/addons/docs/vue/README.md @@ -93,10 +93,10 @@ storiesOf('InfoButton', module) [MDX](../docs/mdx.md) is a convenient way to document your components in Markdown and embed documentation components, such as stories and props tables, inline. -Docs has peer dependencies on `react` and `babel-loader`. If you want to write stories in MDX, you'll need to add these dependencies as well: +Docs has peer dependencies on `react`. If you want to write stories in MDX, you may need to add this dependency as well: ```sh -yarn add -D react babel-loader +yarn add -D react ``` Then update your `.storybook/main.js` to make sure you load MDX files: diff --git a/addons/docs/vue3/README.md b/addons/docs/vue3/README.md index a263ffe8a2f..655d7acfa16 100644 --- a/addons/docs/vue3/README.md +++ b/addons/docs/vue3/README.md @@ -93,10 +93,10 @@ storiesOf('InfoButton', module) [MDX](../docs/mdx.md) is a convenient way to document your components in Markdown and embed documentation components, such as stories and props tables, inline. -Docs has peer dependencies on `react` and `babel-loader`. If you want to write stories in MDX, you'll need to add these dependencies as well: +Docs has peer dependencies on `react`. If you want to write stories in MDX, you may need to add this dependency as well: ```sh -yarn add -D react babel-loader +yarn add -D react ``` Then update your `.storybook/main.js` to make sure you load MDX files: diff --git a/yarn.lock b/yarn.lock index 13fb2c2963a..c25b5affc01 100644 --- a/yarn.lock +++ b/yarn.lock @@ -6018,12 +6018,10 @@ __metadata: webpack: 4 zone.js: ^0.11.3 peerDependencies: - "@babel/core": ^7.11.5 "@storybook/angular": 6.3.0-alpha.13 "@storybook/vue": 6.3.0-alpha.13 "@storybook/vue3": 6.3.0-alpha.13 "@storybook/web-components": 6.3.0-alpha.13 - babel-loader: ^8.0.0 lit-html: ^1.0.0 react: ^16.8.0 || ^17.0.0 react-dom: ^16.8.0 || ^17.0.0