DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

Brandon Wie
Brandon Wie

Posted on

A dependency conflict between CRA and Storybook

Intro

You may find this post helpful IF you,

  1. initialized a project using CRA β€Š-β€Šin my case, I used npx create-react-app myAppβ€Š-β€Štemplate redux-typescript
  2. installed storybook using npx sb init on top of CRA settings
  3. npm start or yarn start throws an error regarding webpack(4.44.2) and/or babel-loader(8.1.0) package

I tried all possible methods listed on StackOverflow and other blogs. However, I just wanted to share the one that fixed my issue.
Some suggest using the SKIP_PREFLIGHT_CHECK flag; it won't resolve the issue but only covers the matter.

A part of the logged out instructions

There might be a problem with the project dependency tree.
It is likely not a bug in Create React App, but something you need to fix locally.
The react-scripts package provided by Create React App requires a dependency:
"webpack": "4.44.2"
Enter fullscreen mode Exit fullscreen mode

What worked in my case

In package.json, add the option below

Β "optionalDependencies": {
Β "babel-loader": "8.1.0" // or webpack if it's the one causing the error.
Β }
Enter fullscreen mode Exit fullscreen mode

Here's the link to the StackOverflow post.

Top comments (0)

Create an Account!

πŸ‘€ Just want to lurk?

That's fine, you can still create an account and turn on features like 🌚 dark mode.