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: Detect vite project, use vite builder automatically #17860

Merged
merged 5 commits into from
Apr 3, 2022
Merged

Conversation

IanVS
Copy link
Member

@IanVS IanVS commented Apr 2, 2022

Issue:

What I did

This is intended to aid discoverability of the vite builder by automatically initializing a project with the vite builder if a vite config file is detected. It uses a similar approach of looking for a vite config file as vitest.

I could see also detecting whether to use the webpack5 builder, but I didn't do that here, it will fall back to webpack4, as before.

If a --builder option is explicitly provided, it will be used and autodetection won't run.

This also cleans up a few other things, which I can remove if desired:

  1. No longer logs Not using community vite builder, skipping after init, since the distinction between the community vite builder and official vite builder is subtle and might be confusing to users setting up a new storybook project.
  2. Added a newline after messages like Adding Storybook support to your "React" app, since otherwise npm overwrote them once it started installs.

The logs now look something like this:

▶ npx sb@next init

 sb init - the simplest way to add a Storybook to your project.

 • Detecting project type. ✓
    Detected vite project, setting builder to @storybook/builder-vite
 • Adding Storybook support to your "React" app
(#########⠂⠂⠂⠂⠂⠂⠂⠂⠂) ⠋ idealTree:@storybook/builder-vite: sill fetch manifest unfetch@^4.2.0

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?

Without some vite examples for e2e tests, I'm not sure how to write automated tests for this. I did test it out locally, though, and it worked great.

@nx-cloud
Copy link

nx-cloud bot commented Apr 2, 2022

☁️ Nx Cloud Report

CI is running/has finished running commands for commit 534e618. As they complete they will appear below. Click to see the status, the terminal output, and the build insights.

📂 See all runs for this branch


✅ Successfully ran 1 target

Sent with 💌 from NxCloud.

@IanVS IanVS requested a review from shilman April 2, 2022 19:53
@IanVS
Copy link
Member Author

IanVS commented Apr 2, 2022

Hmmm, I can't tell why nx is failing here. yarn bootstrap --core works fine on my own machine...

@shilman shilman changed the title Detect vite project, use vite builder automatically CLI: Detect vite project, use vite builder automatically Apr 2, 2022
Copy link
Member

@shilman shilman left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM -- great stuff @IanVS ❤️

shilman and others added 2 commits April 3, 2022 08:14
These additional methods are used in find-up and must be present in the mock `fs`
@shilman shilman merged commit a034cb3 into next Apr 3, 2022
@shilman shilman deleted the detect-vite branch April 3, 2022 03:43
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants