CODEWITHSUNDEEP
javascriptreactjsstorybook
Iseult
Iseult

Reputation: 41

Getting stuck loading react storybook

I can't start my storybook app. It loads only loading state (loading story). There aren't any errors in the console. What am I doing wrong? screenshot

storybook/main.js

const path = require('path')

const autoprefixer = require('autoprefixer')
const lost = require('lost')

const processors = [
  autoprefixer({
    grid: true
  }),

  lost()
]

module.exports = {
  stories: ['../app/ui/**/*.stories.js'],
  webpack: (config) => {
    config.module.rules.push({
      test: /\.scss$/,
      use: [
        'cache-loader',
        'style-loader',
        { loader: 'css-loader', options: { sourceMap: true } },
        {
          loader: 'postcss-loader',
          options: {
            sourceMap: true,

            plugins: (loader) => processors
          }
        },
        { loader: 'sass-loader', options: { sourceMap: true } }
      ],
      include: path.resolve(__dirname, '../')
    })
    return config
  }
}

Button.stories.js (sample component)

import React from 'react'
import Button from './Button'

export default { component: Button, title: 'Button' }

export const withText = () => <Button>Hello Button</Button>

export const bigSizes = () => (
  <Button
    size='big'
    color='ultra-light-gray'
    borderRadius='big'
  >
    Big grey btn
  </Button>
)

System:

System: OS: Windows 10 10.0.18363 Binaries: Node: 12.14.1 - C:\Program Files\nodejs\node.EXE npm: 6.13.6 - C:\Program Files\nodejs\npm.CMD Browsers: Edge: 44.18362.449.0 npmPackages: @storybook/react: ^5.3.18 => 5.3.18

Upvotes: 4

Views: 9493

Answers (2)

trainoasis
trainoasis

Reputation: 6720

If you have @storybook/preset-create-react-app check that you haven't updated that to higher version as well. To me this happened when I tried updating both. When this was reverted to lower version (^3.2.0 in my case) and just storybook updated to ^6.5.4 everything came back up.

Might be worth checking other storybook dependencies besides this one and playing with different version combinations.

Upvotes: 0

DevDanyal
DevDanyal

Reputation: 66

This conflict went away for me by updating storybook to the latest version.

npx sb@latest upgrade

Upvotes: 1

Related Questions