Install storybook for ember

[gossi]

After a discussion in discord:

Installing storybook for ember should be straightforward and only minimal effort.

1. Installation:

With ember:

ember install @storybook/ember-cli-storybook

With npx (as mentioned on the Quickstart Guide):

npx -p @storybook/cli sb init

(that command should detect ember and then install ember-cli-storybook)

2. Configuration:

After installation is run, developers make their changes in .storybook/ folder.

[dbendaou]

Thanks !

Also https://storybook.js.org/docs/guides/guide-ember/ alone doesn't work as mentioned above, in the current situation, you need to do ember install ember-cli-storybook and npx -p @storybook/cli sb init
So we shall update the documentation for it while both options are fixed to work correctly :)

[dbendaou]

Related issue on storybook repo: storybookjs/storybook#10074

[jonniebigodes]

Sorry for piggyback on this issue, but there's something that might also be in the interest of this.

While trying to add the ember cli to a new project that will back the Intro to Storybook tutorial i'm faced with the following error:

ember install @storybook/ember-cli-storybook

Installing packages... This might take a couple of minutes.
npm: Installed @storybook/ember-cli-storybook
installing ember-cli-storybook
The `ember generate <entity-name>` command requires an entity name to be specified. For more details, use `ember help`.

The output of ember --version

ember --version
ember-cli: 3.17.0
node: 12.15.0
os: win32 x64

Steps taken:

1- ember new taskbox
2- npx -p @storybook/cli sb init to install and initialize Storybook.
3- ember install @storybook/ember-cli-storybook to install the adapter.

Also based on the documentation, if you change the storybook script to the following:
ember serve & start-storybook -p 6006 -s dist (also in the docs the port is 9009, but it's defaulting to 6006), it gets stuck on the ember side and the Storybook script execution never kicks in. As you can see below:

> [email protected] storybook C:\Users\MyUser\MyFolder\storybook-related\learnstorybook_with_ember\taskbox
> npm run start & start-storybook -p 6006 -s dist


> [email protected] start C:\Users\MyUser\MyFolder\storybook-related\learnstorybook_with_ember\taskbox
> ember serve

Generating files needed by Storybook
Parsing C:\Users\MyUSer\AppData\Local\Temp\broccoli-18696VE7FWlrViX4y\out-247-append_ember_auto_import_analyzer\tests\index.html
Generating preview-head.html
Generating files needed by Storybook
Generating .env

Build successful (9219ms) – Serving on http://localhost:4200/



Slowest Nodes (totalTime => 5% )              | Total (avg)
----------------------------------------------+---------------------
Babel: @ember/test-helpers (2)                | 2323ms (1161 ms)
Package /assets/vendor.js (1)                 | 1681ms
BroccoliRollup (6)                            | 1534ms (255 ms)
ember-auto-import-analyzer (3)                | 586ms (195 ms)

Me or any other user needs to issue ctrl+c to "kill" the ember execution so that he/she can use Storybook.

As the package npm-run-all is added, probably might be in the interest of the cli to include a new script to allow the user to correctly use Storybook with the cli, i added the following to my scripts:

 "storybook-dev":"npm-run-all --aggregate-output --continue-on-error --parallel start storybook"

And got both working correctly even with the error mentioned above.

Feel free to provide feedback

[gossi]

So, apparently:

ember install @storybook/ember-cli-storybook

should also run:

npx -p @storybook/cli sb init

primarily the generator should do this: ember generate ember-cli-storybook. This was "fixed" in the latest release b3a25ae (at least that's what we thought). For some reasons, the blueprint cannot be run without an argument, which causes it to fail.

This line here is what we currently think is relevant for the failure:

ember-cli-storybook/blueprints/ember-cli-storybook/index.js

Line 2 in 94fdd83

normalizeEntityName() {},

(also this is what other ember addons do o_O)

So, let's keep this issue open until fixed.

Related to: chromaui/learnstorybook.com#306

[gossi]

There was a conversation on ember discord today: https://discordapp.com/channels/480462759797063690/662337973995700224/732916663111909407 (please scroll down). Mainly chris manson was providing a good hint about scoped packages and default blueprint resolution:

Want to keep it here, to save the information.

[gabrielcsapo]

The error as a result of the default blueprint not running should be fixed in #57.