Simplify setup for monorepos #877

sibelius · 2019-12-04T15:07:45Z

Describe the Feature

On iOS, you need to set PROJECT_ROOT in order to make CLI work in a monorepo. On Android, same set of configuration is required.

Possible Implementations

Get rid of PROJECT_ROOT on iOS because it's not needed anymore
Figure out strategy for Android.

Related Issues

related to #865 #656

The text was updated successfully, but these errors were encountered:

sibelius · 2019-12-04T15:08:27Z

this is my error when building

Error: Cannot find module '/app/packages/app/node_modules/react-native/cli.js'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:794:15)
    at Function.Module._load (internal/modules/cjs/loader.js:687:27)
    at Function.Module.runMain (internal/modules/cjs/loader.js:1025:10)
    at internal/main/run_main_module.js:17:11 {
  code: 'MODULE_NOT_FOUND',
  requireStack: []
}

as it searches for react-native in the wron glocation

sibelius · 2019-12-09T21:49:48Z

I've got this working like this

project.ext.react = [
    entryFile: "index.js",
    bundleInStaging: true,
    devDisabledInStaging: true,
    bundleInAlpha: true,
    devDisabledInAlpha: true,
    enableHermes: false,  // clean and rebuild if changing
+    root: "../../../../"
]

modifying root path on app/build.gradle

but this raised another issue

error Invalid platform "android" selected.
info Available platforms are: "native". If you are trying to bundle for an out-of-tree platform, it may not be installed.

it only shows the android command inside react-native packages inside our monorepo (like here https://github.com/entria/entria-fullstack/tree/master/packages/app), but fails on root

what is the proper solution for this?

sibelius · 2019-12-11T15:49:30Z

fixed android like this

project.ext.react = [
   cliPath: "../../node_modules/react-native/cli.js",
]

sibelius · 2019-12-11T15:49:51Z

ios also need this

export NODE_BINARY=node
export PROJECT_ROOT="$PROJECT_DIR/.."

../../../node_modules/react-native/scripts/react-native-xcode.sh

grabbou · 2020-01-13T12:58:30Z

Yeah, in my experience, this is the major root cause for all of the monorepo issues that a lot of people are facing these days.

Any idea how we could plug into it? Setting dynamically variables?

sibelius · 2020-01-13T13:24:44Z

this is a hard one, maybe a monorepo documentation guide could be good enough

yuzhakovvv · 2020-02-11T12:26:22Z

fixed android like this

project.ext.react = [
   cliPath: "../../node_modules/react-native/cli.js",
]

In my case it was

project.ext.react = [
    ...
    entryFile: "index.js",
    cliPath: "../node_modules/react-native/cli.js",
]

Because project structure is:

node_modules/
- react-native/
mobile/
- node_modules/
- index.js
shared/
web/

grabbou · 2020-03-19T10:33:46Z

@sibelius, following up to my discussions #656 (comment), we should be able to safely remove PROJECT_ROOT.

In theory, we always want it to be ios/.. and even if it ends up being deeper in the hierarchy, CLI knows what to do.

grabbou · 2020-03-19T10:35:30Z

If you look at the details of the commit that introduced this change - facebook/react-native@9ccde37, I believe its assumptions are no longer true and we can get rid of it.

Waiting for Janic to get back to me whether this is right and I believe we can follow up with a PR. This particular change shouldn't require anything on the CLI side.

grabbou · 2020-03-19T10:36:22Z

The ideal for me is this on iOS, regardless of your step

export NODE_BINARY=node
../../../node_modules/react-native/scripts/react-native-xcode.sh

grabbou · 2020-03-19T14:31:51Z

As per Janic's comment, we're good to go with the suggested changes.

I will proceed with them soon and link a PR that is landing in React Native as a result.

grabbou · 2020-03-20T09:24:22Z

Just filled in React Native PR - facebook/react-native#28354. Appreciate your review and support in additional explanations :)

tad3j · 2020-06-02T13:21:34Z

Did anyone got build working with hermes enabled in a monorepo?

I've got hermes to work by telling react where it's files are:
hermesCommand: "/mnt/c/Users/user/WebstormProjects/project/node_modules/hermes-engine/%OS-BIN%/hermes",

This solved the initial issue of not being able to build becasue hermes executable was not found, however with this fix in place build is still failing with:

internal/modules/cjs/loader.js:638
    throw err;
    ^

Error: Cannot find module '/mnt/c/Users/user/WebstormProjects/project/packages/mobile/node_modules/react-native/scripts/compose-source-maps.js'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:636:15)
    at Function.Module._load (internal/modules/cjs/loader.js:562:25)
    at Function.Module.runMain (internal/modules/cjs/loader.js:831:12)
    at startup (internal/bootstrap/node.js:283:19)
    at bootstrapNodeJSCore (internal/bootstrap/node.js:623:3)

> Task :app:bundleReleaseJsAndAssets FAILED

...because it is looking for node_modules folder in wrong location; the correct location is the same as in hermesCommand, /mnt/c/Users/user/WebstormProjects/project/node_modules.

Building works with enableHermes: false, so it only fails with hermes is enabled.

Any suggestion how to get around this?

My full react config from gradle:

project.ext.react = [
  entryFile   : "index.js",
  enableHermes: true,  // clean and rebuild if changing
  hermesCommand: "/mnt/c/Users/user/WebstormProjects/project/node_modules/hermes-engine/%OS-BIN%/hermes",
  cliPath     : "../../node_modules/react-native/cli.js",
]

EDIT:
I figured out that one can also use relative path for hermesCommand, which is a bit different than cliPath. Seems like one has to point hermesCommand 2 levels higher in directory structure (when compared to cliPath):

hermesCommand: "../../../../node_modules/hermes-engine/%OS-BIN%/hermes",

EDIT2 / SOLUTION:
By digging through the source code I found that composeSourceMapsPath config key exists, so my whole react config looks like this:

project.ext.react = [
  entryFile   : "index.js",
  enableHermes: true,  // clean and rebuild if changing
  hermesCommand: "../../../../node_modules/hermes-engine/%OS-BIN%/hermes",
  composeSourceMapsPath: "../../node_modules/react-native/scripts/compose-source-maps.js",
  cliPath     : "../../node_modules/react-native/cli.js",
]

This got me pass the issue with compose-source-maps.js and I think files were successfully processed by hermes. However, there seems to still be an issue with code-push, since build fails with

Error: Cannot find module '/mnt/c/Users/user/WebstormProjects/project/packages/mobile/node_modules"/react-native-code-push/scripts/generateBundledResourcesHash.js'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:636:15)
    at Function.Module._load (internal/modules/cjs/loader.js:562:25)
    at Function.Module.runMain (internal/modules/cjs/loader.js:831:12)
    at startup (internal/bootstrap/node.js:283:19)
    at bootstrapNodeJSCore (internal/bootstrap/node.js:623:3)

...so this time code-push is looking node_modules in wrong location. I think this issue is out of scope here, so I guess I should check Microsoft's github regarding this.

CelsoTeixeira · 2021-05-13T04:26:07Z

Following @tad3j answer, using react-native 0.63.2 I had to change hermesCommand.

hermesCommand: "../../../../node_modules/hermes-engine/%OS-BIN%/hermes",

Changed to:

hermesCommand: "../../../../node_modules/hermes-engine/%OS-BIN%/hermesc",

I still need to pass all other configuration, composeSourceMapsPath, cliPath and hermesCommand. Not passing composeSourceMapsPath was throwing a error.

My monorepo configuration is more or less like this, trying to not use nohoist at all.

monorepo
  - node_modules
     - react-native
  - packages
      - app
      - web
      - any other shared package

My final build.gradle project.ext.react is the following:

project.ext.react = [
    entryFile: "packages/app/index.js",
    enableHermes: true,  // clean and rebuild if changing,
    hermesCommand: "../../../../node_modules/hermes-engine/%OS-BIN%/hermesc",
    composeSourceMapsPath: "../../node_modules/react-native/scripts/compose-source-maps.js",
    cliPath: "../../node_modules/react-native/cli.js",
]

eliw00d · 2021-09-08T22:01:52Z

Has anyone that uses monorepos been able to get Sentry to work? I posted there but figured I'd ask here as well. I followed the examples in here for project.ext.react and it has solved everything except Sentry source maps.

liamjones · 2021-09-09T07:36:04Z

@eliw00d Yes, we do, I'll post on the Sentry ticket since it's specific to that.

xzilja · 2022-01-29T12:27:36Z

Had issues with ios not finding index.js entry with solutions above, what ended up working is

export PROJECT_ROOT=$PROJECT_DIR/..
export ENTRY_FILE=$PROJECT_ROOT/index.js

phvictorino · 2022-07-14T14:45:53Z

Had issues with ios not finding index.js entry with solutions above, what ended up working is
export PROJECT_ROOT=$PROJECT_DIR/..
export ENTRY_FILE=$PROJECT_ROOT/index.js

after days trying to fix the problem finally this worked for me

sibelius · 2022-07-15T00:56:39Z

good enough for me

sibelius added the feature request label Dec 4, 2019

jbinda mentioned this issue Jan 7, 2020

[react-native-cli] Simplify setup for monorepos callstack/react-native-open-source-board#162

Open

yuzhakovvv mentioned this issue Feb 11, 2020

[monorepo] bundling doesn't work (workaround available) #656

Closed

grabbou changed the title ~~handle CLI_PATH on monorepo features~~ Simplify setup for monorepos Mar 19, 2020

grabbou pinned this issue Mar 19, 2020

grabbou self-assigned this Mar 19, 2020

grabbou added this to the 5.x milestone Mar 19, 2020

morr0ne mentioned this issue May 14, 2020

A template for monorepos should be provided #1170

Closed

tad3j mentioned this issue Jun 2, 2020

Deployment and hermes builds are failing in monorepo (Lerna, Yarn workspaces) microsoft/react-native-code-push#1867

Closed

sunnylqm mentioned this issue Aug 25, 2021

求助安卓原生集成RN打包问题 reactnativecn/react-native-website#499

Closed

kelset unpinned this issue Jan 28, 2022

skeie mentioned this issue May 16, 2022

[Android setup. monorepo] - shopify_react-native-skia Shopify/react-native-skia#446

Closed

sibelius closed this as completed Jul 15, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Simplify setup for monorepos #877

Simplify setup for monorepos #877

sibelius commented Dec 4, 2019 •

edited by grabbou

Loading

sibelius commented Dec 4, 2019

sibelius commented Dec 9, 2019

sibelius commented Dec 11, 2019

sibelius commented Dec 11, 2019

grabbou commented Jan 13, 2020

sibelius commented Jan 13, 2020

yuzhakovvv commented Feb 11, 2020

grabbou commented Mar 19, 2020

grabbou commented Mar 19, 2020

grabbou commented Mar 19, 2020 •

edited

Loading

grabbou commented Mar 19, 2020

grabbou commented Mar 20, 2020

tad3j commented Jun 2, 2020 •

edited

Loading

CelsoTeixeira commented May 13, 2021 •

edited

Loading

eliw00d commented Sep 8, 2021

liamjones commented Sep 9, 2021

xzilja commented Jan 29, 2022

phvictorino commented Jul 14, 2022

sibelius commented Jul 15, 2022

Simplify setup for monorepos #877

Simplify setup for monorepos #877

Comments

sibelius commented Dec 4, 2019 • edited by grabbou Loading

Describe the Feature

Possible Implementations

Related Issues

sibelius commented Dec 4, 2019

sibelius commented Dec 9, 2019

sibelius commented Dec 11, 2019

sibelius commented Dec 11, 2019

grabbou commented Jan 13, 2020

sibelius commented Jan 13, 2020

yuzhakovvv commented Feb 11, 2020

grabbou commented Mar 19, 2020

grabbou commented Mar 19, 2020

grabbou commented Mar 19, 2020 • edited Loading

grabbou commented Mar 19, 2020

grabbou commented Mar 20, 2020

tad3j commented Jun 2, 2020 • edited Loading

CelsoTeixeira commented May 13, 2021 • edited Loading

eliw00d commented Sep 8, 2021

liamjones commented Sep 9, 2021

xzilja commented Jan 29, 2022

phvictorino commented Jul 14, 2022

sibelius commented Jul 15, 2022

sibelius commented Dec 4, 2019 •

edited by grabbou

Loading

grabbou commented Mar 19, 2020 •

edited

Loading

tad3j commented Jun 2, 2020 •

edited

Loading

CelsoTeixeira commented May 13, 2021 •

edited

Loading