Skip to content

Commit

Permalink
docs: update documentation regarding main.js to use default exports
Browse files Browse the repository at this point in the history
  • Loading branch information
yannbf committed Jan 27, 2023
1 parent b6d7fcc commit 0e05b29
Show file tree
Hide file tree
Showing 108 changed files with 152 additions and 149 deletions.
2 changes: 1 addition & 1 deletion code/addons/a11y/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ $ yarn add @storybook/addon-a11y --dev
Add this line to your `main.js` file (create this file inside your Storybook config directory if needed).

```js
module.exports = {
export default {
addons: ['@storybook/addon-a11y'],
};
```
Expand Down
2 changes: 1 addition & 1 deletion code/addons/actions/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ npm i -D @storybook/addon-actions
Then, add following content to [`.storybook/main.js`](https://storybook.js.org/docs/react/configure/overview#configure-your-storybook-project):

```js
module.exports = {
export default {
addons: ['@storybook/addon-actions'],
};
```
Expand Down
2 changes: 1 addition & 1 deletion code/addons/backgrounds/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ npm i -D @storybook/addon-backgrounds
Then, add following content to [`.storybook/main.js`](https://storybook.js.org/docs/react/configure/overview#configure-your-storybook-project):

```js
module.exports = {
export default {
addons: ['@storybook/addon-backgrounds'],
};
```
Expand Down
2 changes: 1 addition & 1 deletion code/addons/controls/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ npm i -D @storybook/addon-controls
Then, add following content to [`.storybook/main.js`](https://storybook.js.org/docs/react/configure/overview#configure-your-storybook-project):

```js
module.exports = {
export default {
addons: ['@storybook/addon-controls'],
};
```
Expand Down
6 changes: 3 additions & 3 deletions code/addons/docs/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -99,9 +99,9 @@ yarn add -D react
Then add the following to your `.storybook/main.js`:

```js
module.exports = {
export default {
stories: [
'../src/**/*.mdx)', // 👈 Add this, to match your project's structure
'../src/**/*.mdx', // 👈 Add this, to match your project's structure
'../src/**/*.stories.@(js|jsx|ts|tsx)',
],
addons: [
Expand Down Expand Up @@ -138,7 +138,7 @@ Add the following to your Jest configuration:
The `addon-docs` preset has a few configuration options that can be used to configure its babel/webpack loading behavior. Here's an example of how to use the preset with options:

```js
module.exports = {
export default {
addons: [
{
name: '@storybook/addon-docs',
Expand Down
8 changes: 4 additions & 4 deletions code/addons/docs/angular/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ yarn add -D @storybook/addon-docs@next
Then add the following to your `.storybook/main.js` exports:

```js
module.exports = {
export default {
addons: ['@storybook/addon-docs'],
};
```
Expand Down Expand Up @@ -135,9 +135,9 @@ yarn add -D react

Then update your `.storybook/main.js` to make sure you load MDX files:

```ts
module.exports = {
stories: ['../src/stories/**/*.stories.@(js|ts|mdx)'],
```js
export default {
stories: ['../src/**/*.mdx', '../src/**/*.stories.@(js|jsx|ts|tsx)'],
};
```

Expand Down
4 changes: 2 additions & 2 deletions code/addons/docs/common/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ yarn add -D @storybook/addon-docs@next
Then add the following to your `.storybook/main.js` addons:

```js
module.exports = {
export default {
addons: ['@storybook/addon-docs'],
};
```
Expand All @@ -43,7 +43,7 @@ yarn add -D react
Then update your `.storybook/main.js` to make sure you load MDX files:

```js
module.exports = {
export default {
stories: ['../src/stories/**/*.stories.@(js|mdx)'],
};
```
Expand Down
4 changes: 2 additions & 2 deletions code/addons/docs/ember/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@ yarn add -D @storybook/addon-docs@next
Then add the following to your `.storybook/main.js` addons:

```js
module.exports = {
export default {
addons: ['@storybook/addon-docs'],
};
```
Expand Down Expand Up @@ -87,7 +87,7 @@ yarn add -D react
Then update your `.storybook/main.js` to make sure you load MDX files:

```js
module.exports = {
export default {
stories: ['../src/stories/**/*.stories.@(js|mdx)'],
};
```
Expand Down
6 changes: 3 additions & 3 deletions code/addons/docs/react/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ yarn add -D @storybook/addon-docs@next
Then add the following to your `.storybook/main.js` list of `addons`:

```js
module.exports = {
export default {
// other settings
addons: ['@storybook/addon-docs'];
}
Expand Down Expand Up @@ -70,7 +70,7 @@ storiesOf('InfoButton', module)
Then update your `.storybook/main.js` to make sure you load MDX files:

```js
module.exports = {
export default {
stories: ['../src/stories/**/*.stories.@(js|mdx)'],
};
```
Expand Down Expand Up @@ -115,7 +115,7 @@ If you're using TypeScript, there are two different options for generating props
You can add the following lines to your `.storybook/main.js` to switch between the two (or disable docgen):

```js
module.exports = {
export default {
typescript: {
// also valid 'react-docgen-typescript' | false
reactDocgen: 'react-docgen',
Expand Down
8 changes: 4 additions & 4 deletions code/addons/docs/vue/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ yarn add -D @storybook/addon-docs@next
Then add the following to your `.storybook/main.js` addons:

```js
module.exports = {
export default {
addons: ['@storybook/addon-docs'],
};
```
Expand All @@ -39,9 +39,9 @@ module.exports = {
The `addon-docs` preset for Vue has a configuration option that can be used to configure [`vue-docgen-api`](https://github.com/vue-styleguidist/vue-styleguidist/tree/dev/packages/vue-docgen-api), a tool which extracts information from Vue components. Here's an example of how to use the preset with options for Vue app:

```js
const path = require('path');
import path from 'path';

module.exports = {
export default {
addons: [
{
name: '@storybook/addon-docs',
Expand Down Expand Up @@ -102,7 +102,7 @@ yarn add -D react
Then update your `.storybook/main.js` to make sure you load MDX files:

```js
module.exports = {
export default {
stories: ['../src/stories/**/*.stories.@(js|mdx)'],
};
```
Expand Down
8 changes: 4 additions & 4 deletions code/addons/docs/vue3/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -29,7 +29,7 @@ yarn add -D @storybook/addon-docs@next
Then add the following to your `.storybook/main.js` addons:

```js
module.exports = {
export default {
addons: ['@storybook/addon-docs'],
};
```
Expand All @@ -39,9 +39,9 @@ module.exports = {
The `addon-docs` preset for Vue has a configuration option that can be used to configure [`vue-docgen-api`](https://github.com/vue-styleguidist/vue-styleguidist/tree/dev/packages/vue-docgen-api), a tool which extracts information from Vue components. Here's an example of how to use the preset with options for Vue app:

```js
const path = require('path');
import path from 'path';

module.exports = {
export default {
addons: [
{
name: '@storybook/addon-docs',
Expand Down Expand Up @@ -102,7 +102,7 @@ yarn add -D react
Then update your `.storybook/main.js` to make sure you load MDX files:

```js
module.exports = {
export default {
stories: ['../src/stories/**/*.stories.@(js|mdx)'],
};
```
Expand Down
4 changes: 2 additions & 2 deletions code/addons/essentials/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -28,7 +28,7 @@ npm install --save-dev @storybook/addon-essentials
And then add the following line to your `.storybook/main.js`:

```js
module.exports = {
export default {
addons: ['@storybook/addon-essentials'],
};
```
Expand All @@ -44,7 +44,7 @@ If you want to reconfigure an addon, simply install that addon per that addon's
You can disable any of Essential's addons using the following configuration scheme in `.storybook/main.js`:

```js
module.exports = {
export default {
addons: [{
name: '@storybook/addon-essentials',
options: {
Expand Down
2 changes: 1 addition & 1 deletion code/addons/highlight/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ npm i -D @storybook/addon-highlight
Add `"@storybook/addon-highlight"` to the addons array in your `.storybook/main.js`:

```js
module.exports = {
export default {
addons: ['@storybook/addon-highlight'],
};
```
Expand Down
4 changes: 2 additions & 2 deletions code/addons/interactions/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ yarn add -D @storybook/addon-interactions @storybook/jest @storybook/testing-lib
within `.storybook/main.js`:

```js
module.exports = {
export default {
addons: ['@storybook/addon-interactions'],
};
```
Expand All @@ -28,7 +28,7 @@ Step debugging features are experimental and disabled by default. To enable them

```js
// main.js
module.exports = {
export default {
features: {
interactionsDebugger: true,
},
Expand Down
2 changes: 1 addition & 1 deletion code/addons/jest/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,7 @@ Or if you're using yarn as a package manager:
Register the addon in your [`.storybook/main.js`](https://storybook.js.org/docs/react/configure/overview#configure-your-storybook-project):

```js
module.exports = {
export default {
addons: ['@storybook/addon-jest'],
};
```
Expand Down
2 changes: 1 addition & 1 deletion code/addons/links/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ yarn add -D @storybook/addon-links
within `.storybook/main.js`:

```js
module.exports = {
export default {
addons: ['@storybook/addon-links'],
};
```
Expand Down
2 changes: 1 addition & 1 deletion code/addons/measure/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ npm i -D @storybook/addon-measure
Add `"@storybook/addon-measure"` to the addons array in your `.storybook/main.js`:

```js
module.exports = {
export default {
addons: ['@storybook/addon-measure'],
};
```
Expand Down
2 changes: 1 addition & 1 deletion code/addons/outline/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,7 +15,7 @@ npm i -D @storybook/addon-outline
Then, add following content to [`.storybook/main.js`](https://storybook.js.org/docs/react/configure/overview#configure-your-storybook-project):

```js
module.exports = {
export default {
addons: ['@storybook/addon-outline'],
};
```
Expand Down
2 changes: 1 addition & 1 deletion code/addons/storyshots-core/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -723,7 +723,7 @@ If you use [Component Story Format](https://storybook.js.org/docs/react/api/csf)

```js
// jest.config.js
module.exports = {
export default {
transform: {
'^.+\\.stories\\.jsx?$': '@storybook/addon-storyshots/injectFileName',
'^.+\\.jsx?$': 'babel-jest',
Expand Down
8 changes: 4 additions & 4 deletions code/addons/storysource/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -26,15 +26,15 @@ You can add configuration for this addon by using a preset or by using the addon
Add the following to your `.storybook/main.js` exports:

```js
module.exports = {
export default {
addons: ['@storybook/addon-storysource'],
};
```

You can pass configurations into the addon-storysource loader in your `.storybook/main.js` file, e.g.:

```js
module.exports = {
export default {
addons: [
{
name: '@storybook/addon-storysource',
Expand Down Expand Up @@ -67,7 +67,7 @@ Storybook 6.0 introduced an unintentional change to `source-loader`, in which on
If you're using `addon-docs`:

```js
module.exports = {
export default {
addons: [
{
name: '@storybook/addon-docs',
Expand All @@ -84,7 +84,7 @@ module.exports = {
If not:

```js
module.exports = {
export default {
addons: [
{
name: '@storybook/addon-storysource',
Expand Down
2 changes: 1 addition & 1 deletion code/addons/toolbars/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ npm i -D @storybook/addon-toolbars
Then, add following content to [`.storybook/main.js`](https://storybook.js.org/docs/react/configure/overview#configure-your-storybook-project):

```js
module.exports = {
export default {
addons: ['@storybook/addon-toolbars'],
};
```
Expand Down
2 changes: 1 addition & 1 deletion code/addons/viewport/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ npm i -D @storybook/addon-viewport
Then, add following content to [`.storybook/main.js`](https://storybook.js.org/docs/react/configure/overview#configure-your-storybook-project):

```js
module.exports = {
export default {
addons: ['@storybook/addon-viewport'],
};
```
Expand Down
9 changes: 6 additions & 3 deletions code/frameworks/ember/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -41,9 +41,12 @@ In your `.storybook/main.js` you can add the following lines:
```javascript
const namedBlockPolyfill = require('ember-named-blocks-polyfill/lib/named-blocks-polyfill-plugin');

module.exports = {
emberOptions: {
polyfills: [namedBlockPolyfill],
export default {
framework: {
name: '@storybook/ember',
options: {
polyfills: [namedBlockPolyfill],
}
},
[...]
};
Expand Down
Loading

0 comments on commit 0e05b29

Please sign in to comment.