question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

npx create-react-app throws error when using in monorepo

See original GitHub issue

Is this a bug report?

Maybe. I know monorepos are not fully supported, however i would expect this to work.

Did you try recovering your dependencies?

Yes

Environment

Node v8.11.3 yarn 1.10.1 npx 6.4.1

Steps to Reproduce

(Write your steps here:)

  1. Create a lerna / yarn workspaces repo
  2. naviagte to packages folder
  3. run create-react-app@next --scripts-version=@next cra-app

Expected Behavior

It should create a new create react app.

Actual Behavior

When running create-react-app@next --scripts-version=@next cra-app, I am getting the following error:

{ Error: Cannot find module '/Users/felixkuehl/cra-monorepo/packages/cra-app/node_modules/react-scripts/package.json'
    at Function.Module._resolveFilename (module.js:547:15)
    at Function.Module._load (module.js:474:25)
    at Module.require (module.js:596:17)
    at require (internal/module.js:11:18)
    at checkNodeVersion (/Users/felixkuehl/.npm/_npx/66044/lib/node_modules/create-react-app/createReactApp.js:543:23)
    at getPackageName.then.then.then.packageName (/Users/felixkuehl/.npm/_npx/66044/lib/node_modules/create-react-app/createReactApp.js:344:7)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:188:7) code: 'MODULE_NOT_FOUND' }

This could maybe due to yarn workspaces package hoisting.

Workaround is to just run create-react-app@next --scripts-version=@next cra-app outside the monorepo, then delete the node_modules folder and copy the new app into the monorepo. Anyways, keep up the great work! 😉

Issue Analytics

  • State:open
  • Created 5 years ago
  • Reactions:1
  • Comments:5 (4 by maintainers)

github_iconTop GitHub Comments

3reactions
FelixKuehlcommented, Oct 3, 2018

@weyert Check out my example repo https://github.com/FelixKuehl/cra-monorepo In this setup I am using a Create React App 2.x together with a library to share components. I build a package in this monorepo called library-utils, that provides a custom babel watcher and handles basic setup to compile every package in your monorepo, if needed. So every create react app can be used as a library by simply adding 'build:watch': 'library-utils build:watch' to it’s scripts (Do not forget to specify main and module as well). The library is compiled and watched by babel. This works pretty well for me and basically behaves just as well as the original monorepo support in CRA 2. At least for my use case.

If you need more details, take a look at the readme in my repo and checkout my original Issue regarding dropped monorepo support in CRA 2 stable: https://github.com/facebook/create-react-app/issues/5100

Hope that helps!

3reactions
Timercommented, Oct 1, 2018

Yeah, we can probably fix this. For now, just use your workaround. Thanks for the report!

Read more comments on GitHub >

github_iconTop Results From Across the Web

Using Create-React-App In A Monorepo - Frontend Digest
Why are we getting this error? CRA is telling us there is an Unexpected token in the code we are importing from our...
Read more >
Setting Up Monorepo With Create React App - Medium
Now we have all that setup lets get our apps ready, from both the app and components folder run npx create-react-app --template typescript...
Read more >
npx create-react-app show error when installing - Stack Overflow
Sounds like you are running npx create-react-app command in a project that already includes react. Try running npm install instead.
Read more >
How to Create a React Typescript Monorepo with Git ...
Open up the App.tsx file in the src directory of the project generated by create-react-app . We are going to add a simple...
Read more >
Lerna: Documentation
Monorepos let you develop multiple packages in the same repository, ... To use monorepos well, you need a good monorepo tool, and Lerna...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found