Skip to content
This repository has been archived by the owner on Jan 16, 2023. It is now read-only.

🖇 A Babel macro needed for some advanced Storybook setups. Used to mock webpack's context function in test environments.

License

Notifications You must be signed in to change notification settings

storybookjs/require-context.macro

Repository files navigation

require-context.macro

A macro needed for some advanced Storybook@4 and Storybook@3 setups

Babel Macro

Credit to the original plugin.

Usage

Ensure you have babel-plugin-macros installed within your project.

yarn add -D babel-plugin-macros

Then install this specific macro

yarn add -D require-context.macro

Afterwards, simply import this function and call it in place of require.context() inside .storybook/config.js.

// .storybook/config.js

import { configure } from '@storybook/react';
import requireContext from 'require-context.macro';

import '../src/index.css';

const req = requireContext('../src/components', true, /\.stories\.js$/);

function loadStories() {
  req.keys().forEach((filename) => req(filename));
}

configure(loadStories, module);

You may also need to make Storybook aware of the fact that you're using Babel macros! You can do this by declaring macros as one of the options in your array of plugins within your babel config.

One example, with a .babelrc at the root-level of your repository:

{
  "plugins": ["macros"]
}

About

🖇 A Babel macro needed for some advanced Storybook setups. Used to mock webpack's context function in test environments.

Topics

Resources

License

Stars

Watchers

Forks

Packages

No packages published