Storybook: Refactor CLI to include commands that perform Storybook related actions

Created on 23 May 2017  路  23Comments  路  Source: storybookjs/storybook

I have big plans for the cli:
I actually want to build something like this (eventually):

sb start   # starts and opens storybook 

```sh
sb start --public # starts and create a temp public url to share

```sh
sb build  # builds to static site

```sh
sb deploy # builds to static site & deploy to heroku

```sh
sb help <searchterm>  # search our documentation 

```sh
sb migrate # run codemods to latest version

```sh
sb init  # adds storybook to project (auto-detect or asks)

```sh
sb init --react # adds storybook for react to project

```sh
sb info  # show version, addons, system, config status 

Initialising could be done without a global install using npx:

npx sb -- init

Choose which template:

npx sb -- init --type=vue

system info:
https://github.com/tabrindle/envinfo

cli feature request help wanted todo

Most helpful comment

Really wanted to work on this, so reached out the @ndelangen on Slack and for now the short term goals are to:

  • [x] Change the current CLI to be able to handle more than just one thing.
  • [x] Implement the trivial commands like start and build.
  • [x] Probably also some migrations of tests.

After that, it can be expanded with all the ideas in this issue.
@wuweiweiwu, are you still down to work on this?

All 23 comments

In continuation of #764.
It would be nice to extend getstorybook with API which allow specifying custom templates in addition to those from @storybook/cli package.
I guess getstorybook was created to solve the issue of quick adding Storybook to the existing project. And it solved it at that stage, but the more new addons聽appear, the more time we need to spend to install them manually and harder to start using the project for beginners.

So providing additional customization could help with:

  • including addons

  • organizing files/folders structure

  • adding custom decorators or anything else to stories

  • adding specific boilerplates

Such templates could handle some specific use cases of Storybook

I think this API could look like this, for example:

getstorybook --with package

where package is everything that can be installed by npm i

Then we can provide some own extensions e.g.:

getstorybook --with @storybook/template-kitchen-sink

-- to get storybook with the maximum configuration

And other developers could create their own, like:

getstorybook --with https://github.com/react-theming/material-ui.git

what do you think?

I like the idea of adding addons via our cli.

I'm thinking we could add a add command to the future CLI:

sb add knobs

And in fact what would be really cool is if we could offer a autocomple feature here...

sb add

Would then use enquirer and a json-fetch to grab the list of recommended addons from https://storybook.js.org/addons.json

I really want to do away with the getstorybook uni-command that does absolutely everything using dark magic.

Just a quick update. I was busy for the last 2 weekends. Will pick this up following weekend.

I was bedridden with flu this weekend :( I have a 2 week holiday coming up, will make some time to pick it up before Xmas.

馃巹 馃巵

@ndelangen are there any plans to allow programmatic usage of storybook's build system? I'm needing to do something like:

const storybook = require('build-storybook');
const buildConfig = {/* ... */};
//...
storybook(buildConfig);

I'd be more than happy to contribute with a PR, just need some direction on how to get started...

@gersongoulart I'd be happy to add this functionality to storybook.

How to exactly achieve this, I'd have to really dive into too. Right now, I just don't know either.

Let's have a look together, maybe you, me and @ersel can go on a skype-call together and figure this out?

I would be happy to have a call any time this week.

@gersongoulart when would you be available? Would you mind joining our slack so we can communicate easier?

self invite link

@ndelangen, @ersel sorry for the delay, much going on lately. The "self invite link" above is no longer working (probably expired). I'm in Vancouver (UTC-08:00) but would be more than happy to join in a Skype call whenever works best for you.

UPDATED the link above

@ndelangen can we close this one?

I'd like to make these tickets more scoped in the future so they aren't open forever. If we are planning to add addons via the CLI, can we create a new ticket specifically for that?

Sorry for the radio silence, my circumstances have changed since we last spoke. I have recently started a new job and don't have time to pick this up anymore. Hope someone else can pick it up.

@ndelangen @danielduan I'd like to take this up!

Seems like a large todo list..

perhaps starting with adding packages via the getstorybook cli?

@wuweiweiwu and me are going to discuss this epic tomorrow evening.

I would definitely like to help out with this when we're actively working on it! 馃槏

Really wanted to work on this, so reached out the @ndelangen on Slack and for now the short term goals are to:

  • [x] Change the current CLI to be able to handle more than just one thing.
  • [x] Implement the trivial commands like start and build.
  • [x] Probably also some migrations of tests.

After that, it can be expanded with all the ideas in this issue.
@wuweiweiwu, are you still down to work on this?

storybook snippets [framework] : add some sample snippets from the chosen framework (detected one or in param) as stories
We could also inject them from the kitchen sinks

storybook upgrade : upgrade to latest version of the cli

mmmh... storybook deploy is it worth trying surge instead ? surge would be free.

storybook test : run the storyshots ?

Is there work left to do for this feature? I would like to work on this

Hurrah!! I just released https://github.com/storybookjs/storybook/releases/tag/v5.2.0-alpha.44 containing PR #7414 that references this issue. Upgrade today to try it out!

You can find this prerelease on the @next NPM tag.

Closing this issue. Please re-open if you think there's still more to do.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

wahengchang picture wahengchang  路  3Comments

purplecones picture purplecones  路  3Comments

MrOrz picture MrOrz  路  3Comments

ZigGreen picture ZigGreen  路  3Comments

alexanbj picture alexanbj  路  3Comments