question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

addon-knobs/react - Rendered more hooks than during the previous render

See original GitHub issue

When using addon-knobs and adding the decorator at the .storiesOf level I get the error.

bundle.js:300234 Error: Rendered more hooks than during the previous render.
    at useHook (bundle.js:74282)
    at useMemoLike (bundle.js:74309)
    at useEffect (bundle.js:74407)
    at registerKnobs (bundle.js:70880)
    at wrapper (bundle.js:70748)
    at bundle.js:74655

This could only be an issue on react-native, and only occurs for me when:

  1. Using react-native (I haven’t tested vanilla react)
  2. Registering storiesOf('aStory', module).addDecorator(withKnobs)

To Reproduce Create a story that uses addon-knobs at the storiesOf level, with react-native.

Example:

storiesOf('X', module)
  .addDecorator(withKnobs)
  .add('X', () => (<View />), {}, )

Once I move the withKnobs decorator to the global level, everything is good again 👍 👍 👍

// config.ts
import {  addDecorator } from '@storybook/react-native'
import { withKnobs } from '@storybook/addon-knobs/react'

addDecorator(withKnobs)

So no real complaint here, but thought I should mention the issue. This seems very likely related to https://github.com/storybookjs/storybook/issues/6679 . Thought the fix might be useful to someone else in this slightly specific case.

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Reactions:1
  • Comments:7 (3 by maintainers)

github_iconTop GitHub Comments

1reaction
brookemitchellcommented, Oct 13, 2019

Sorry no just haven’t had time. I’ll close and revisit the repro when I get time later this week.

0reactions
sibeliuscommented, Mar 30, 2022

anybody solved this?

Read more comments on GitHub >

github_iconTop Results From Across the Web

preview > decorators causes: "Rendered more hooks than ...
Describe the bug When adding a decorator to .storybook/preview.js an error occurs: "Rendered more hooks than during the previous render.
Read more >
Rendered more hooks than during the previous render
Using addDecorator in Storybook's preview. ts throws Rendered more hooks than during the previous render. Save this question. Show activity on ...
Read more >
error: rendered more hooks than during the previous render.
First of all you should remove your function call from the useState function, you should only perform your side effects inside a useEffect...
Read more >
React Error: Rendered more hooks than during the previous ...
React Error: Rendered more hooks than during the previous render. ... If you've ever written React with hooks, chances are, you've probably been ......
Read more >
Knobs & Backgrounds addons cause React hooks ... - Issuehunt
Describe the bug Error message: "Rendered more hooks than during the previous render." displayed instead of stories. To Reproduce Steps to reproduce the ......
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found