简体   繁体   中英

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

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

npx sb@latest upgrade

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.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM