storybook: Uncaught Error: Singleton client API not yet initialized, cannot call `addParameters`.

Describe the bug A clear and concise description of what the bug is. 2021-12-06 at 12 59 PM

To Reproduce

Repo: https://github.com/suhaotian/storybook-rnw-monorepo/

# clone and checkout 
git clone https://github.com/suhaotian/storybook-rnw-monorepo.git
git checkout reproduce
# install use yarn
yarn
# run storybook
yarn dev:storybook:react

then open developer console:

Uncaught Error: Singleton client API not yet initialized, cannot call `addParameters`.

System

Environment Info:

  System:
    OS: macOS 11.4
    CPU: (4) x64 Intel(R) Core(TM) i5-4278U CPU @ 2.60GHz
  Binaries:
    Node: 16.13.0 - /usr/local/bin/node
    Yarn: 1.22.5 - ~/.yarn/bin/yarn
    npm: 8.1.0 - /usr/local/bin/npm
  Browsers:
    Chrome: 96.0.4664.55
    Safari: 14.1.1

About this issue

  • Original URL
  • State: closed
  • Created 3 years ago
  • Comments: 27 (11 by maintainers)

Most upvoted comments

Ah, then if you want to use addon-knobs (which is deprecated, controls are the new way to accomplish the same thing), you’d need to pin all the rest of your storybook versions to 6.4.0 as well. See https://github.com/storybookjs/storybook/blob/next/MIGRATION.md#deprecated-addon-knobs for the migration guide for knobs -> controls.

I found the problem and am leaving this note in case it helps anyone in future. In my case, I was trying to combine the Storybook webpack config with my own. My webpack config used ts-loader to handle the Typescript. I removed that plugin and relied on Storybook’s built-in babel-loader.

I’m not sure why using ts-loader caused the problem, but it was obviously wasteful to use two loaders anyway. If you have this problem, my advice would be to start with the config you get from webpackFinal, verify that the introduction page loads and then gradually add in the webpack configuration fields you need.

I also found that sometimes Storybook did not pick up changes to my configuration (e.g. after reverting a change that broke the build, my build was still broken). If you are working on the configuration, I recommend clearing node_modules/.cache/storybook after every change to make sure you’re seeing fresh builds.