Skip to content

Commit ab4c17a

Browse files
committed
feat(storybook): fixup review comments
1 parent 5e3b3f4 commit ab4c17a

File tree

12 files changed

+46
-160
lines changed

12 files changed

+46
-160
lines changed

docs/generated/packages/storybook/generators/configuration.json

-6
Original file line numberDiff line numberDiff line change
@@ -58,20 +58,14 @@
5858
"description": "Storybook UI Framework to use.",
5959
"enum": [
6060
"@storybook/angular",
61-
"@storybook/html-webpack5",
6261
"@storybook/nextjs",
63-
"@storybook/preact-webpack5",
6462
"@storybook/react-webpack5",
6563
"@storybook/react-vite",
6664
"@storybook/server-webpack5",
67-
"@storybook/svelte-webpack5",
6865
"@storybook/svelte-vite",
6966
"@storybook/sveltekit",
70-
"@storybook/vue-webpack5",
7167
"@storybook/vue-vite",
72-
"@storybook/vue3-webpack5",
7368
"@storybook/vue3-vite",
74-
"@storybook/web-components-webpack5",
7569
"@storybook/web-components-vite"
7670
],
7771
"aliases": ["storybook7UiFramework"],

docs/generated/packages/storybook/generators/migrate-9.json

+7-1
Original file line numberDiff line numberDiff line change
@@ -20,8 +20,14 @@
2020
},
2121
"noUpgrade": {
2222
"type": "boolean",
23-
"description": "Skip upgrading Storybook packages. Only use this option if you are already on version 9, and you do not want the latest beta.",
23+
"description": "Skip upgrading Storybook packages. Only use this option if you are already on version 9, and you do not want to install the packages again.",
2424
"default": false
25+
},
26+
"versionTag": {
27+
"type": "string",
28+
"description": "The version of Storybook to use. Use 'latest' to use the latest stable version, or 'next' to use the latest beta.",
29+
"default": "latest",
30+
"enum": ["latest", "next"]
2531
}
2632
},
2733
"examplesFile": "",

docs/generated/packages/storybook/migrations/21.1.0-package-updates.json

-59
Original file line numberDiff line numberDiff line change
@@ -11,14 +11,6 @@
1111
"alwaysAddToPackageJson": false
1212
},
1313
"storybook": { "version": "^9.0.0", "alwaysAddToPackageJson": true },
14-
"@storybook/addon-jest": {
15-
"version": "^9.0.0",
16-
"alwaysAddToPackageJson": false
17-
},
18-
"@storybook/addon-mdx-gfm": {
19-
"version": "^9.0.0",
20-
"alwaysAddToPackageJson": false
21-
},
2214
"@storybook/addon-onboarding": {
2315
"version": "^9.0.0",
2416
"alwaysAddToPackageJson": false
@@ -27,16 +19,10 @@
2719
"version": "^9.0.0",
2820
"alwaysAddToPackageJson": false
2921
},
30-
"@storybook/blocks": {
31-
"version": "^9.0.0",
32-
"alwaysAddToPackageJson": false
33-
},
3422
"@storybook/builder-webpack5": {
3523
"version": "^9.0.0",
3624
"alwaysAddToPackageJson": false
3725
},
38-
"@storybook/cli": { "version": "^9.0.0", "alwaysAddToPackageJson": false },
39-
"@storybook/core": { "version": "^9.0.0", "alwaysAddToPackageJson": false },
4026
"@storybook/core-webpack": {
4127
"version": "^9.0.0",
4228
"alwaysAddToPackageJson": false
@@ -46,18 +32,6 @@
4632
"version": "^9.0.0",
4733
"alwaysAddToPackageJson": false
4834
},
49-
"@storybook/html-webpack5": {
50-
"version": "^9.0.0",
51-
"alwaysAddToPackageJson": false
52-
},
53-
"@storybook/manager-api": {
54-
"version": "^9.0.0",
55-
"alwaysAddToPackageJson": false
56-
},
57-
"@storybook/postinstall": {
58-
"version": "^9.0.0",
59-
"alwaysAddToPackageJson": false
60-
},
6135
"@storybook/preact": {
6236
"version": "^9.0.0",
6337
"alwaysAddToPackageJson": false
@@ -66,14 +40,6 @@
6640
"version": "^9.0.0",
6741
"alwaysAddToPackageJson": false
6842
},
69-
"@storybook/preact-webpack5": {
70-
"version": "^9.0.0",
71-
"alwaysAddToPackageJson": false
72-
},
73-
"@storybook/preview-api": {
74-
"version": "^9.0.0",
75-
"alwaysAddToPackageJson": false
76-
},
7743
"@storybook/react-vite": {
7844
"version": "^9.0.0",
7945
"alwaysAddToPackageJson": false
@@ -90,10 +56,6 @@
9056
"version": "^9.0.0",
9157
"alwaysAddToPackageJson": false
9258
},
93-
"@storybook/store": {
94-
"version": "^9.0.0",
95-
"alwaysAddToPackageJson": false
96-
},
9759
"@storybook/svelte": {
9860
"version": "^9.0.0",
9961
"alwaysAddToPackageJson": false
@@ -102,43 +64,22 @@
10264
"version": "^9.0.0",
10365
"alwaysAddToPackageJson": false
10466
},
105-
"@storybook/svelte-webpack5": {
106-
"version": "^9.0.0",
107-
"alwaysAddToPackageJson": false
108-
},
109-
"@storybook/theming": {
110-
"version": "^9.0.0",
111-
"alwaysAddToPackageJson": false
112-
},
113-
"@storybook/vue": { "version": "^9.0.0", "alwaysAddToPackageJson": false },
11467
"@storybook/vue-vite": {
11568
"version": "^9.0.0",
11669
"alwaysAddToPackageJson": false
11770
},
118-
"@storybook/vue-webpack5": {
119-
"version": "^9.0.0",
120-
"alwaysAddToPackageJson": false
121-
},
12271
"@storybook/vue3": { "version": "^9.0.0", "alwaysAddToPackageJson": false },
12372
"@storybook/vue3-vite": {
12473
"version": "^9.0.0",
12574
"alwaysAddToPackageJson": false
12675
},
127-
"@storybook/vue3-webpack5": {
128-
"version": "^9.0.0",
129-
"alwaysAddToPackageJson": false
130-
},
13176
"@storybook/web-components": {
13277
"version": "^9.0.0",
13378
"alwaysAddToPackageJson": false
13479
},
13580
"@storybook/web-components-vite": {
13681
"version": "^9.0.0",
13782
"alwaysAddToPackageJson": false
138-
},
139-
"@storybook/web-components-webpack5": {
140-
"version": "^9.0.0",
141-
"alwaysAddToPackageJson": false
14283
}
14384
},
14485
"aliases": [],

packages/storybook/migrations.json

-68
Original file line numberDiff line numberDiff line change
@@ -760,14 +760,6 @@
760760
"version": "^9.0.0",
761761
"alwaysAddToPackageJson": true
762762
},
763-
"@storybook/addon-jest": {
764-
"version": "^9.0.0",
765-
"alwaysAddToPackageJson": false
766-
},
767-
"@storybook/addon-mdx-gfm": {
768-
"version": "^9.0.0",
769-
"alwaysAddToPackageJson": false
770-
},
771763
"@storybook/addon-onboarding": {
772764
"version": "^9.0.0",
773765
"alwaysAddToPackageJson": false
@@ -776,22 +768,10 @@
776768
"version": "^9.0.0",
777769
"alwaysAddToPackageJson": false
778770
},
779-
"@storybook/blocks": {
780-
"version": "^9.0.0",
781-
"alwaysAddToPackageJson": false
782-
},
783771
"@storybook/builder-webpack5": {
784772
"version": "^9.0.0",
785773
"alwaysAddToPackageJson": false
786774
},
787-
"@storybook/cli": {
788-
"version": "^9.0.0",
789-
"alwaysAddToPackageJson": false
790-
},
791-
"@storybook/core": {
792-
"version": "^9.0.0",
793-
"alwaysAddToPackageJson": false
794-
},
795775
"@storybook/core-webpack": {
796776
"version": "^9.0.0",
797777
"alwaysAddToPackageJson": false
@@ -804,18 +784,6 @@
804784
"version": "^9.0.0",
805785
"alwaysAddToPackageJson": false
806786
},
807-
"@storybook/html-webpack5": {
808-
"version": "^9.0.0",
809-
"alwaysAddToPackageJson": false
810-
},
811-
"@storybook/manager-api": {
812-
"version": "^9.0.0",
813-
"alwaysAddToPackageJson": false
814-
},
815-
"@storybook/postinstall": {
816-
"version": "^9.0.0",
817-
"alwaysAddToPackageJson": false
818-
},
819787
"@storybook/preact": {
820788
"version": "^9.0.0",
821789
"alwaysAddToPackageJson": false
@@ -824,14 +792,6 @@
824792
"version": "^9.0.0",
825793
"alwaysAddToPackageJson": false
826794
},
827-
"@storybook/preact-webpack5": {
828-
"version": "^9.0.0",
829-
"alwaysAddToPackageJson": false
830-
},
831-
"@storybook/preview-api": {
832-
"version": "^9.0.0",
833-
"alwaysAddToPackageJson": false
834-
},
835795
"@storybook/react-vite": {
836796
"version": "^9.0.0",
837797
"alwaysAddToPackageJson": false
@@ -848,10 +808,6 @@
848808
"version": "^9.0.0",
849809
"alwaysAddToPackageJson": false
850810
},
851-
"@storybook/store": {
852-
"version": "^9.0.0",
853-
"alwaysAddToPackageJson": false
854-
},
855811
"@storybook/svelte": {
856812
"version": "^9.0.0",
857813
"alwaysAddToPackageJson": false
@@ -860,26 +816,10 @@
860816
"version": "^9.0.0",
861817
"alwaysAddToPackageJson": false
862818
},
863-
"@storybook/svelte-webpack5": {
864-
"version": "^9.0.0",
865-
"alwaysAddToPackageJson": false
866-
},
867-
"@storybook/theming": {
868-
"version": "^9.0.0",
869-
"alwaysAddToPackageJson": false
870-
},
871-
"@storybook/vue": {
872-
"version": "^9.0.0",
873-
"alwaysAddToPackageJson": false
874-
},
875819
"@storybook/vue-vite": {
876820
"version": "^9.0.0",
877821
"alwaysAddToPackageJson": false
878822
},
879-
"@storybook/vue-webpack5": {
880-
"version": "^9.0.0",
881-
"alwaysAddToPackageJson": false
882-
},
883823
"@storybook/vue3": {
884824
"version": "^9.0.0",
885825
"alwaysAddToPackageJson": false
@@ -888,21 +828,13 @@
888828
"version": "^9.0.0",
889829
"alwaysAddToPackageJson": false
890830
},
891-
"@storybook/vue3-webpack5": {
892-
"version": "^9.0.0",
893-
"alwaysAddToPackageJson": false
894-
},
895831
"@storybook/web-components": {
896832
"version": "^9.0.0",
897833
"alwaysAddToPackageJson": false
898834
},
899835
"@storybook/web-components-vite": {
900836
"version": "^9.0.0",
901837
"alwaysAddToPackageJson": false
902-
},
903-
"@storybook/web-components-webpack5": {
904-
"version": "^9.0.0",
905-
"alwaysAddToPackageJson": false
906838
}
907839
}
908840
}

packages/storybook/src/executors/build-storybook/build-storybook.impl.ts

+11-4
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,9 @@ import {
44
pleaseUpgrade,
55
storybookConfigExistsCheck,
66
storybookMajorVersion,
7+
getInstalledStorybookVersion,
78
} from '../../utils/utilities';
9+
import { gte } from 'semver';
810

911
export default async function buildStorybookExecutor(
1012
options: CLIOptions,
@@ -33,11 +35,16 @@ async function runInstance(options: CLIOptions): Promise<void | {
3335
address: string;
3436
networkAddress: string;
3537
}> {
36-
const storybookCore = await (storybookMajorVersion() < 9
37-
? // This is needed for backwards compatibility - but we do not have the package installed in the nx repo
38+
const installedStorybookVersion = getInstalledStorybookVersion();
39+
const hasCoreServerInStorybookPackage = gte(
40+
installedStorybookVersion,
41+
'8.2.0'
42+
);
43+
const storybookCore = await (hasCoreServerInStorybookPackage
44+
? import('storybook/internal/core-server')
45+
: // This is needed for backwards compatibility - but we do not have the package installed in the nx repo
3846
// @ts-ignore
39-
import('@storybook/core-server')
40-
: import('storybook/internal/core-server'));
47+
import('@storybook/core-server'));
4148
const env = process.env.NODE_ENV ?? 'production';
4249
process.env.NODE_ENV = env;
4350
return storybookCore.build({

packages/storybook/src/executors/storybook/storybook.impl.ts

+11-4
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
11
import { ExecutorContext, logger } from '@nx/devkit';
22
import {
3+
getInstalledStorybookVersion,
34
pleaseUpgrade,
45
storybookConfigExistsCheck,
56
storybookMajorVersion,
67
} from '../../utils/utilities';
78
import type { CLIOptions } from 'storybook/internal/types';
9+
import { gte } from 'semver';
810

911
export default async function* storybookExecutor(
1012
options: CLIOptions,
@@ -42,11 +44,16 @@ async function runInstance(options: CLIOptions): Promise<void | {
4244
address: string;
4345
networkAddress: string;
4446
}> {
45-
const storybookCore = await (storybookMajorVersion() < 9
46-
? // This is needed for backwards compatibility - but we do not have the package installed in the nx repo
47+
const installedStorybookVersion = getInstalledStorybookVersion();
48+
const hasCoreServerInStorybookPackage = gte(
49+
installedStorybookVersion,
50+
'8.2.0'
51+
);
52+
const storybookCore = await (hasCoreServerInStorybookPackage
53+
? import('storybook/internal/core-server')
54+
: // This is needed for backwards compatibility - but we do not have the package installed in the nx repo
4755
// @ts-ignore
48-
import('@storybook/core-server')
49-
: import('storybook/internal/core-server'));
56+
import('@storybook/core-server'));
5057
const env = process.env.NODE_ENV ?? 'development';
5158
process.env.NODE_ENV = env;
5259
return storybookCore.build({

packages/storybook/src/generators/configuration/schema.json

-6
Original file line numberDiff line numberDiff line change
@@ -58,20 +58,14 @@
5858
"description": "Storybook UI Framework to use.",
5959
"enum": [
6060
"@storybook/angular",
61-
"@storybook/html-webpack5",
6261
"@storybook/nextjs",
63-
"@storybook/preact-webpack5",
6462
"@storybook/react-webpack5",
6563
"@storybook/react-vite",
6664
"@storybook/server-webpack5",
67-
"@storybook/svelte-webpack5",
6865
"@storybook/svelte-vite",
6966
"@storybook/sveltekit",
70-
"@storybook/vue-webpack5",
7167
"@storybook/vue-vite",
72-
"@storybook/vue3-webpack5",
7368
"@storybook/vue3-vite",
74-
"@storybook/web-components-webpack5",
7569
"@storybook/web-components-vite"
7670
],
7771
"aliases": ["storybook7UiFramework"],

packages/storybook/src/generators/migrate-9/calling-storybook-cli.ts

+2-6
Original file line numberDiff line numberDiff line change
@@ -43,9 +43,7 @@ export function callUpgrade(schema: Schema): 1 | Buffer {
4343
bodyLines: [
4444
`🚨 The Storybook CLI failed to upgrade your @storybook/* packages to the latest version.`,
4545
`Please try running the sb upgrade command manually:`,
46-
`${pm.exec} ${
47-
packageManager === 'yarn' ? 'storybook' : 'storybook@latest'
48-
} upgrade`,
46+
`${pm.exec} storybook@${schema.versionTag} upgrade`,
4947
],
5048
color: 'red',
5149
});
@@ -80,9 +78,7 @@ export function callAutomigrate(
8078
([projectName, storybookProjectInfo]) => {
8179
const packageManager = detectPackageManager();
8280
const pm = getPackageManagerCommand(packageManager);
83-
const commandToRun = `${pm.dlx} ${
84-
packageManager === 'yarn' ? 'storybook' : 'storybook@latest'
85-
} automigrate --config-dir ${storybookProjectInfo.configDir}`;
81+
const commandToRun = `${pm.dlx} storybook automigrate --config-dir ${storybookProjectInfo.configDir}`;
8682
try {
8783
output.log({
8884
title: `Calling sb automigrate for ${projectName}`,

0 commit comments

Comments
 (0)