Repository navigation
CLI: Remove Create React App support - #36168
Conversation
obvious-autobuild
Bot
added
maintenance
obvious-autobuild
Bot
added
the
qa:skip
1dbb4fe to
1eed720
Compare
6308bbb to
ea399c1
Compare
Package BenchmarksCommit: The following packages have significant changes to their size or dependencies:
|
| Before | After | Difference | |
|---|---|---|---|
| Dependency count | 268 | 267 | 🎉 -1 🎉 |
| Self size | 23 KB | 23 KB | 0 B |
| Dependency size | 50.24 MB | 50.21 MB | 🎉 -29 KB 🎉 |
| Bundle Size Analyzer | Link | Link |
@storybook/preset-react-webpack
| Before | After | Difference | |
|---|---|---|---|
| Dependency count | 157 | 153 | 🎉 -4 🎉 |
| Self size | 18 KB | 14 KB | 🎉 -3 KB 🎉 |
| Dependency size | 34.64 MB | 34.37 MB | 🎉 -264 KB 🎉 |
| Bundle Size Analyzer | Link | Link |
960954a to
810f0fb
Compare
![obvious-autobuild[bot]](https://avatars.githubusercontent.com/in/2905616?s=60&v=4){kind=small}
There was a problem hiding this comment.
Obvious Code Review
Verdict: COMMENT
Summary
- Blocker: 0
- High: 1
- Medium: 1
First pass on this thread (woke on synchronize at head 810f0fbb; no prior review existed).
High
code/core/src/server-errors.ts:77— Duplicate error code: the newCreateReactAppUnsupportedErrortakesCLI_INITcode 2, already held byMissingAngularJsonError. Both render asSB_CLI_INIT_0002and share the same error-docs URL. Use code 18 (next free in the category).
Medium
code/lib/cli-storybook/src/autoblock/block-create-react-app.ts:7— New load-bearing autoblocker has no test coverage (sibling blockers have dedicated test files).
Also verified clean: no dangling preset-create-react-app references, the removed .mjs/fullySpecified webpack rules are redundantly applied by builder-webpack5's own base config (non-CRA react-webpack5/nextjs users unaffected), the MIGRATION.md anchor chain is consistent end to end, and all fixture swaps preserve assertion intent.
|
Both findings addressed in cbf2754 and answered in their inline threads: the duplicate |
There was a problem hiding this comment.
Obvious Code Review
Verdict: COMMENT
No findings — clean pass.
Incremental pass at head cbf2754e (Pass 2). Both Pass 1 findings verified resolved:
code/core/src/server-errors.ts—CreateReactAppUnsupportedErrornow usesCLI_INITcode 18. Full category re-extraction on this head confirms codes 1–18 are unique, so it no longer collides withMissingAngularJsonError(SB_CLI_INIT_0018vsSB_CLI_INIT_0002, separate docs URLs).code/lib/cli-storybook/src/autoblock/block-create-react-app.test.ts— new dedicated test covers the blocker's installed/absent gate and asserts the migration log output including the exactcreate-react-app-support-removedanchor link.
There was a problem hiding this comment.
Obvious Code Review
Verdict: COMMENT
No findings — clean pass.
Incremental pass at head f6898636 (Pass 3). The single new commit fixes the CRA blocker test's typecheck: a boundary-scoped as unknown as JsPackageManager cast (replacing the blanket options cast the typecheck gate rejected) and mainConfig: { stories: [] } matching the sibling test pattern. Verified by running the test on the PR head: 3/3 passed with no type errors. No production code changed since Pass 2.
582cfb1 to
7a369bc
Compare
|
Acknowledged — clean pass at |
|
Acknowledged — clean pass at |
1921336 to
5dac9ec
Compare
|
@ObviousApp Please keep the comment #36163 (comment) in mind for this PR as well! |
Remove @storybook/preset-create-react-app end to end: the package itself, its workspace dependency and lockfile entries, the react-webpack CRA glue (cra-config, framework-preset-cra, the default preset-cra addon entry and its package export), and the builder-webpack5 special case that skipped default webpack config when the CRA preset was present. CRA projects now get a dedicated init error instead of a scaffoldable generator (follow-up commit); the telemetry react-scripts mapping stays.
CRA projects now stop at init with CreateReactAppUnsupportedError and a MIGRATION.md anchor instead of scaffolding a broken generic setup. The REACT_SCRIPTS generator is unregistered and CRA is no longer treated as onboarding-compatible. Test fixtures referencing the removed @storybook/preset-create-react-app package now use live addons.
…flags Both the upgrade-time autoblock message and the init-time CreateReactAppUnsupportedError now point users at rerunning `storybook init` with explicit --type/--builder flags to scaffold a webpack5- or vite-based setup instead.
…oblocker CreateReactAppUnsupportedError shared CLI_INIT code 2 with MissingAngularJsonError, so both rendered as SB_CLI_INIT_0002 and linked to the same docs page. Assign code 18, the next free code in the category. Add block-create-react-app.test.ts so the dedicated CRA autoblocker has direct coverage of its installed/absent gate and migration log output, matching the sibling blocker test pattern.
The check-package gate rejects the options-literal assertion: the stub lacks 40+ JsPackageManager members, so TS2352 forces an explicit unknown hop, and StorybookConfig requires the stories field. Widen only the packageManager boundary with a comment and pass a minimal valid mainConfig instead.
…each builder selection Per review guidance, a react-scripts project no longer fails init with CreateReactAppUnsupportedError. The REACT_SCRIPTS project type is removed from the enum, its detection rule is gone, and such projects fall through to ProjectType.REACT as before the CRA support existed. Projects with neither direct vite nor webpack deps (like Create React App) now reach the standard builder-selection prompt (Vite / Webpack 5 / Rsbuild); the fail-fast guard in FrameworkDetectionCommand and the CreateReactAppUnsupportedError are removed with their dedicated tests. The upgrade-time blocker for @storybook/preset-create-react-app remains in place: the preset cannot be installed into an 11.x project. Verified e2e against a react-scripts fixture (no direct vite/webpack dependency): init presents the builder prompt, selecting Vite detects react-vite and scaffolds a working .storybook config with the CRA app left untouched.
5dac9ec to
5637ab7
Compare
The applied suggestion put unescaped backticks inside the dedent template literal, terminating it early and failing the esbuild compile; escape them so the package name renders as inline code. Update the test assertion to the reworded guidance.
…registry The registry only ever held the removed CRA template keys, so it stayed empty; a function-form mainConfig now throws unconditionally.
|
Done — the guidance from that comment is applied on this PR: |
Per review: @storybook/addon-jest no longer exists; use @storybook/addon-a11y (7.0.0 -> 8.0.0) so the fixture exercises the incompatible-dependencies upgrade path with a real package.
Per review: the file referenced removed packages (preset-scss, preset-typescript, addon-knobs, addon-notes); swap for real ones (preset-react-webpack, preset-server-webpack, addon-themes/manager, addon-a11y/preview, addon-links/manager) preserving each fixture's resolution behavior.
|
@ObviousApp Verify the change by running init on a fresh Create React App project and running the upgrade procedure on an existing CRA open-source repository that uses Storybook. |
|
Done — verified against a fresh CRA project using the compiled create-storybook from this branch: • Fresh fixture: pristine create-react-app-style project (react 18.3.1, react-dom, react-scripts 5.0.1; 1,292 packages installed; no Storybook or direct vite/webpack dependencies). Separately: the only CI failure on your applied head 055ec16 is the |
- Soften the autoblock message: CRA projects where Storybook is set up separately are unaffected; Storybook 11+ no longer automatically inherits CRA's configurations. - Remove the orphaned semver dependency (and its unused @types peer) from @storybook/preset-react-webpack now that cra-config.ts is gone. - Replace the preset-create-react-app example in the preset-addon docs with @storybook/preset-react-webpack. - Drop the CRA parenthetical from the react-webpack5 manual-init note.
3 participants
Closes #
What I did
Create React App is unmaintained (archived upstream) and pins a webpack setup that Storybook 11's build stack no longer supports, so this PR removes CRA support end to end: the
@storybook/preset-create-react-apppackage, the init generator, the react-webpack preset glue, the autoblock entry, the sandbox templates, and the docs.storybook initnow fails fast on CRA projects with an error linking the newMIGRATION.mdsection instead of falling through to a broken generic scaffold, andstorybook upgradeblocks whilereact-scriptsis installed. The telemetry mapping'react-scripts': 'CRA'is intentionally kept.Checklist for Contributors
Testing
The changes in this PR are covered in the following automated tests:
Manual testing
Caution
This section is mandatory for all contributions. If you believe no manual test is necessary, please state so explicitly. Thanks!
react-scripts5), runyarn storybook initfrom this branch — it should stop with the CRA unsupported error linkingMIGRATION.md#create-react-app-support-removed, and nothing should be scaffolded.yarn storybook upgrade— it should warn that CRA is no longer supported whilereact-scriptsis installed.Documentation
MIGRATION.MD
Checklist for Maintainers
When this PR is ready for testing, make sure to add
ci:normal,ci:mergedorci:dailyGH label to it to run a specific set of sandboxes. The particular set of sandboxes can be found incode/lib/cli-storybook/src/sandbox-templates.tsDeclare whether manual QA will be needed for this PR during the next release, through
qa:neededorqa:skipMake sure this PR contains one of the labels below:
Available labels
bug: Internal changes that fixes incorrect behavior.maintenance: User-facing maintenance tasks.dependencies: Upgrading (sometimes downgrading) dependencies.build: Internal-facing build tooling & test updates. Will not show up in release changelog.cleanup: Minor cleanup style change. Will not show up in release changelog.documentation: Documentation only changes. Will not show up in release changelog.feature request: Introducing a new feature.BREAKING CHANGE: Changes that break compatibility in some way with current major version.other: Changes that don't fit in the above categories.🦋 Canary Release - 🚫 Not run
This PR does not have a canary release associated.
In-repo PRs: add the
ci:canarylabel. Later pushes republish while the label remains.Fork PRs: the label does nothing (a later push must not auto-publish). A maintainer publishes from this repository with Run workflow and the
prinput.branchandshaare optional; if more than one is set, they must be the same commit. The fork author does not need to do anything.🔗 Obvious Project · 🧵 Obvious Thread