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.

Storybook 5.2 has issues with TypeScript types

See original GitHub issue

Describe the bug If I upgrade from 5.1 to 5.2, I start getting TypeScript errors in my project:

Module '".../node_modules/@storybook/react/dist/client"' has no exported member 'RenderFunction'.

13 import { RenderFunction } from '@storybook/react';
            ~~~~~~~~~~~~~~

According to issue #8160, we’re supposed to remove all @types/storybook... packages, but that makes things worse:

node_modules/@storybook/react/dist/client/preview/index.d.ts:2:23 - error TS2688: Cannot find type definition file for 'webpack-env'.

2 /// <reference types="webpack-env" />
                        ~~~~~~~~~~~

error TS7016: Could not find a declaration file for module '@storybook/addon-knobs/react'. '.../node_modules/@storybook/addon-knobs/react.js' implicitly has an 'any' type.
  Try `npm install @types/storybook__addon-knobs` if it exists or add a new declaration (.d.ts) file containing `declare module '@storybook/addon-knobs/react';`

1 import { text, select } from '@storybook/addon-knobs/react';
                               ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Where are we supposed to be getting the types from? Neither the Storybook package nor the @types package seems to have all the updated types.

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Reactions:16
  • Comments:16 (6 by maintainers)

github_iconTop GitHub Comments

11reactions
shilmancommented, Oct 1, 2019

@hipstersmoothie @dawidk92 i’ll patch those over to master soon and cut a release, probably next week

5reactions
ryancatcommented, Oct 18, 2019

On top of removing the unnecessary types definition files, I found I need to update how to get the API from

import {withKnobs, number} from '@storybook/addon-knobs/react';

to

import {withKnobs, number} from '@storybook/addon-knobs';
Read more comments on GitHub >

github_iconTop Results From Across the Web

TypeScript - Storybook
Storybook is a frontend workshop for building UI components and pages in isolation. Thousands of teams use it for UI development, testing, and...
Read more >
Storybook breaks after TypeScript upgrade (v3 to v4)
After upgrading TypeScript from 3.9.6 to 4.4.4, our storybook breaks with the several errors similar to this one: ERROR in .
Read more >
@storybook/addon-actions - npm
You can define action handles in a declarative way using withActions decorators. It accepts the same arguments as actions Keys have '<eventName> ...
Read more >
Type Enthusiast's Notes about TypeScript. Part 1. Typing in ...
The code examples have been tested with TypeScript v4.4.4, v4.5.2, ... with TS types, I ended up with a draft the size of...
Read more >
Configure React Storybook for use with Typescript - Egghead.io
js in the special storybook folder, and tsconfig.json. We're also going to add a couple of new dependencies, the types definition for react, ......
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