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: Workaround for react native sb init #12405

Merged
merged 3 commits into from Sep 10, 2020
Merged

Conversation

dannyhw
Copy link
Member

@dannyhw dannyhw commented Sep 7, 2020

Issue: #12334

Also various issues from http://github.com/storybookjs/react-native are probably resolved by this

What I did

I changed the react native generator to work specifically for react native. There are currently some special cases for react native that aren't worth implementing on the base generator because they could be solved with a v6 of react native.

I also made some changes to simplify the examples.

How to test my changes

You can try out the changes by generating a new react native project and then running the cli index.js with node from inside the react native project. Here is a brief explanation on how you can do that:

from this repo build the cli

cd lib/cli
yarn prepare

Install the expo cli (if you already have expo cli installed you can skip this step)

npm i -g expo-cli

Generate a react native project with expo.

expo init --template blank myNewProject

It would be ideal to do this near the storybook repo so the file path is easier to figure out

Within the terminal navigate to the react native project cd myNewProject

Run the local build of the cli

node PATH_T0_STORYBOOK_REPO/lib/cli/bin/index.js init --type react_native

choose yes when prompted to install the storybook server

the package.json should have the following dependencies added

"@storybook/addon-actions": "^5.3",
"@storybook/addon-knobs": "^5.3",
"@storybook/addon-links": "^5.3",
"@storybook/addon-ondevice-actions": "^5.3.21",
"@storybook/addon-ondevice-knobs": "^5.3.21",
"@storybook/react-native": "^5.3.21",
"@storybook/react-native-server": "^5.3.21",
"babel-loader": "^8.1.0",

the storybook command should also be added to the scripts in package json

"storybook": "start-storybook -p 7007",

To run the project delete the contents of app.js and add the following export {default} from './storybook';

Then you can check the ondevice ui with yarn web or yarn ios or yarn android.
If you don't have a simulator setup I recommend using yarn web since it should work regardless.

Check the server with yarn storybook

@dannyhw dannyhw changed the title fix: workaround for cli init of react native project (WIP) fix: workaround for cli init of react native project Sep 9, 2020
import { JsPackageManager } from '../../js-package-manager';
import { NpmOptions } from '../../NpmOptions';
import { GeneratorOptions } from '../baseGenerator';
Copy link
Member

Choose a reason for hiding this comment

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

is baseGenerator still used anywhere?

Copy link
Member Author

@dannyhw dannyhw Sep 10, 2020

Choose a reason for hiding this comment

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

GeneratorOptions is the type for the options parameter on the generator function other than that it's not used

@shilman shilman changed the title fix: workaround for cli init of react native project CLI: Workaround for react native sb init Sep 10, 2020
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.

Great job @dannyhw! 🙌

@shilman shilman merged commit f1a4722 into next Sep 10, 2020
@shilman shilman deleted the fix/react-native-cli-init branch September 10, 2020 14:15
@shilman shilman added patch:yes Bugfix & documentation PR that need to be picked to main branch patch:done Patch/release PRs already cherry-picked to main/release branch labels Oct 1, 2020
shilman added a commit that referenced this pull request Oct 3, 2020
CLI: Workaround for react native `sb init`
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug cli patch:done Patch/release PRs already cherry-picked to main/release branch patch:yes Bugfix & documentation PR that need to be picked to main branch react-native
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

4 participants