Move @types/node to dependencies and accept v16 types

[Methuselah96]

Issue: N/A

What I did

Error I'm trying to fix:

../../.yarn/__virtual__/@storybook-react-virtual-c572635270/0/cache/@storybook-react-npm-6.4.7-9297a6b4b2-a834b3042a.zip/node_modules/@storybook/react/dist/ts3.9/client/preview/index.d.ts(2,23): error TS2688: Cannot find type definition file for 'node'.

This happens because app/react/src/client/preview/index.d.ts ends up referencing @types/node when compiled:

/// <reference types="webpack-env" />
/// <reference types="node" />
import { ClientStoryApi, Loadable } from '@storybook/addons';
import './globals';
import { IStorybookSection } from './types';
import { ReactFramework } from './types-6-0';
interface ClientApi extends ClientStoryApi<ReactFramework['storyResult']> {
    setAddon(addon: any): void;
    configure(loader: Loadable, module: NodeModule): void;
    getStorybook(): IStorybookSection[];
    clearDecorators(): void;
    forceReRender(): void;
    raw: () => any;
}
export declare const storiesOf: ClientApi['storiesOf'];
export declare const configure: ClientApi['configure'];
export declare const addDecorator: ClientApi['addDecorator'];
export declare type DecoratorFn = Parameters<typeof addDecorator>[0];
export declare const addParameters: ClientApi['addParameters'];
export declare const clearDecorators: ClientApi['clearDecorators'];
export declare const setAddon: ClientApi['setAddon'];
export declare const forceReRender: ClientApi['forceReRender'];
export declare const getStorybook: ClientApi['getStorybook'];
export declare const raw: ClientApi['raw'];
export {};

Since other dependent packages already depend on @types/node, this shouldn't cause any problems.

How to test

• Is this testable with Jest or Chromatic screenshots?
• Does this need a new example in the kitchen sink apps?
• Does this need an update to the documentation?

If your answer is yes to any of these, please make sure to include it in your PR.

[nx-cloud]

Nx Cloud Report

CI ran the following commands for commit e580e39. Click to see the status, the terminal output, and the build insights.

📂 See all runs for this branch

Status	Command
	nx run-many --target=prepare --all --parallel --max-parallel=15

---

Sent with 💌 from NxCloud.

[Semigradsky]

^14.14.20 || ^16.0.0? And move @types/node to dependencies for other packages too?

See https://github.com/storybookjs/storybook/pull/16894/files

[Methuselah96]

I've added it for the other relevant packages. I'll keep it as 14 unless we somehow combine these PRs.

[shilman]

Hi @Methuselah96 thanks so much for this contribution! 🙏

I did a quick spot check and it looks like preact, html, and bunch of other app/* follows the same pattern. Would you mind:

• Updating those packages as well
• Updating the version selector on all of them to include || ^16.0.0, superceding Accept @types/node v16 types #16894

Would love to merge this ASAP!

[Methuselah96]

@shilman Good catch! Updated!

[Methuselah96]

@shilman I think I've finally got the build passing. It took more changes than I anticipated. Not sure why "chromatic" is failing with "Failed to verify your Storybook", but it seems unrelated to this PR. Let me know if there's anything else I can do.

[Methuselah96]

Looks like a rebuild fixed "chromatic."

[shilman]

Thanks @Methuselah96 for updating this, and also apologies for the struggles getting CI to pass -- I wish it was faster & easier. At any rate, really appreciate it!