CODEWITHSUNDEEP
reactjsstorybook
DoneDeal0
DoneDeal0

Reputation: 6257

Storybook in Create-react-app: typeError: args.flat is not a function

I have installed storybook in a create-react app application thanks to the command npx -p @storybook/cli sb init. Then, I added a basic story to the stories folder. When launching storybook, it crashes and says: typeError: args.flat is not a function

Here is my story:

import React from "react";
import Hello from "./components/Hello";
import faker from "faker";

const text = faker.internet.email();
export const Default = () => {
  return <Hello text={text} />;
};

And the config:

module.exports = {
  stories: ['../src/**/*.stories.js'],
  addons: [
    '@storybook/preset-create-react-app',
    '@storybook/addon-actions',
    '@storybook/addon-links',
  ],
};

I tried to replace it with a custom config:

import { configure } from "@storybook/react";

function loadStories() {
  const req = require.context("../src/stories", true, /\.stories\.js$/);
  req.keys().forEach((filename) => req(filename));
}

configure(loadStories, module);

How to fix this?

Upvotes: 4

Views: 3160

Answers (3)

Utkarsh Namdeo
Utkarsh Namdeo

Reputation: 86

Upgrade your node version, any version above 12 must work.

If you are using nvm

nvm install --lts

Upvotes: 7

ritzy
ritzy

Reputation: 31

There is an issue with below command that is supposed to automatically detect underlying framework. Launching storybook fails with args.flat is not a function error

npx -p @storybook/cli sb init

Use this instead

npx -p @storybook/cli sb init --type react

If you already have storybook pre-installed and face this error, overwrite it with -f command

npx -p @storybook/cli sb init --type react -f

Upvotes: 1

jphawk
jphawk

Reputation: 70

I have experienced the same problem today and fixed it by installing Storybook v. 5.3.19 through Manual setup . Looks like there are some compatibility problems between create-react-app and Storybook 6.+ beta-versions.

Upvotes: 0

Related Questions