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

Support specifying the react-native cli config #1861

Closed
wants to merge 1 commit into from
Closed

Support specifying the react-native cli config #1861

wants to merge 1 commit into from

Conversation

k0nserv
Copy link

@k0nserv k0nserv commented Sep 18, 2017

Issue

Previously it was not possible to get sufficient control over the roots
that the react-native CLI would use. Specifically in the case when the
projectDir and configDir are the same, but it's desirable for the
packager to resolve symlinks one level up in the directory hierarchy.

Our specfic case is this. We have a Lerna monorepo where we end up with a symlink that traverse the directory structure one level up for native packages. The method added in #1530 is not sufficient as it only considers the node_modules at native/node_modules, but not any of native/packages/*/node_modules where the actual symlinks are located. The code is available here

├── native
│   ├── rn-cli.config.js
│   └── storybook
│       ├── addons.js
│       ├── index.android.js
│       ├── index.ios.js
│       └── storybook.js <--- Native config
│   ├── packages
│   │   ├── react-native-bpk-component-button
│   │   │   ├── index.js
│   │   │   ├── package.json
│   │   │   ├── readme.md
│   │   │   ├── rightarrow_360.png
│   │   │   ├── src
│   │   │   ├── node_modules <-- Contains the symlink to `bpk-tokens`
│   │   │   └── stories.js
├── packages
│   ├── bpk-tokens <-- Package that we symlink via lerna in native packages

What I did

I've added a new flag to storybook-start.js, --react-native-config which is the path to a react native CLI config. When specified it will be passed to the react native cli start invocation. It also disables certain other flags passed such as --projectRoots and --root as these will otherwise override what's specified in the config.

For our codebase this means we've gone frome

Looking for JS files in
   /path/to/project/native/storybook
   /path/to/project/native
   /path/to/project/native

to

Looking for JS files in
   /path/to/project/native
   /path/to/project

using the following rn-cli.config.js

const path = require('path');

const config = {
  getProjectRoots() {
    return [path.resolve(__dirname), path.resolve(__dirname, '..')];
  },
};

module.exports = config;

How to test

Is this testable with jest or storyshots?

The rest of storybook-start.js is not covered by test so I have not added any, but I'm happy to do so.

Does this need a new example in the kitchen sink apps?
No idea

Does this need an update to the documentation?
Yes most likely the behaviour around the --react-native-config flag needds to be documented.

If your answer is yes to any of these, please make sure to include it in your PR.
I'll do this given you are okay with this approach

Thanks for an awesome project 🎉

Previously it was not possible to get sufficient control over the roots
that the react-native CLI would use. Specifically in the case when the
projectDir and configDir are the same, but it's desirable for the
packager to resolve symlinks one level up in the directory hierarchy.
@k0nserv
Copy link
Author

k0nserv commented Sep 26, 2017

Closing this as #1865 was merged and solves the issue for the time being

@k0nserv k0nserv closed this Sep 26, 2017
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