Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

CLI: Provide guidance for users who try to initialize Storybook on an empty dir #23874

Merged
merged 4 commits into from
Aug 24, 2023

Conversation

yannbf
Copy link
Member

@yannbf yannbf commented Aug 17, 2023

Closes #

What I did

This PR provides a helpful message to users who try to initialize Storybook in an empty directory:
image

Additionally it fixes some bugs in the builder detection logic, so that if users run npx storybook init --force, it will not ask for the builder multiple times, neither will it ask for the builder if the selected project does not support multiple builders.

It also fixes an issue with CRA detection, and some type and linting errors, and excludes NX projects from the installable project types.

How to test

  1. Build the packages
  2. Execute the storybook cli against an empty directory: path/to/cli/bin/index.js init

Checklist

  • Make sure your changes are tested (stories and/or unit, integration, or end-to-end tests)
  • Make sure to add/update documentation regarding your changes
  • If you are deprecating/removing a feature, make sure to update
    MIGRATION.MD

Maintainers

  • When this PR is ready for testing, make sure to add ci:normal, ci:merged or ci:daily GH label to it to run a specific set of sandboxes. The particular set of sandboxes can be found in code/lib/cli/src/sandbox-templates.ts
  • Make sure this PR contains one of the labels below.

["cleanup", "BREAKING CHANGE", "feature request", "bug", "build", "documentation", "maintenance", "dependencies", "other"]

🦋 Canary release

This PR does not have a canary release associated. You can request a canary release of this pull request by mentioning the @storybookjs/core team here.

core team members can create a canary release here or locally with gh workflow run --repo storybookjs/storybook canary-release-pr.yml --field pr=<PR_NUMBER>

@shilman
Copy link
Member

shilman commented Aug 17, 2023

I'm not sure how I feel about this approach, but if we go this direction I'd propose the following changes:

  1. Reduce the amount of text
  2. Reduce the number of options
  3. Provide the install commands inline using the user's preferred package manager, so they don't need to go to another page to find them. (Yes I know these can go out of date, but I think the pros outweigh the cons).
Storybook cannot be installed into an empty project. Please bootstrap one of the following:

📦 Vite CLI for React/Vue/Web Components => npm create vite@latest
See https://....

📦 Angular CLI => npx -p @angular/cli ng new my-project
See https://...

📦 Any other tooling of your choice

Once you've created a project, please re-run `npx storybook@latest init` inside the project root. For more information, see https://storybook.js.org/docs. Good luck! 🚀

@shilman
Copy link
Member

shilman commented Aug 17, 2023

You know what. We’ve already spent way too much time on it. If you want, you can link off to the docs and not include the commands inline. But shorten the text per my suggestion. Let’s just get it shipped! 🚀

Additionally, improve the base generator when it comes to detecting builders
@yannbf yannbf force-pushed the yann/improve-empty-dir-init-message branch from 5b54e7c to d2db9f2 Compare August 21, 2023 06:26
@yannbf yannbf force-pushed the yann/improve-empty-dir-init-message branch from e34e1ea to bdf3573 Compare August 23, 2023 13:26
@yannbf yannbf force-pushed the yann/improve-empty-dir-init-message branch from bdf3573 to 937473b Compare August 23, 2023 14:45
@yannbf yannbf added ci:daily Run the CI jobs that normally run in the daily job. and removed ci:normal labels Aug 23, 2023
@yannbf yannbf merged commit 86e342c into next Aug 24, 2023
22 checks passed
@yannbf yannbf deleted the yann/improve-empty-dir-init-message branch August 24, 2023 09:45
@github-actions github-actions bot mentioned this pull request Aug 25, 2023
15 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug ci:daily Run the CI jobs that normally run in the daily job. cli
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants