react-native init generate broken application (dependencies) #22606

vovkasm · 2018-12-11T18:29:04Z

Review the documentation: https://facebook.github.io/react-native
Search for existing issues: https://github.com/facebook/react-native/issues
Use the latest React Native release: https://github.com/facebook/react-native/releases

Environment

  React Native Environment Info:
    System:
      OS: macOS High Sierra 10.13.6
      CPU: (8) x64 Intel(R) Core(TM) i7-3740QM CPU @ 2.70GHz
      Memory: 6.17 GB / 16.00 GB
      Shell: 5.6.2 - /usr/local/bin/zsh
    Binaries:
      Node: 11.3.0 - /usr/local/bin/node
      Yarn: 1.12.3 - /usr/local/bin/yarn
      npm: 6.4.1 - /usr/local/bin/npm
    SDKs:
      iOS SDK:
        Platforms: iOS 12.1, macOS 10.14, tvOS 12.1, watchOS 5.1
      Android SDK:
        API Levels: 23, 25, 26, 27
        Build Tools: 23.0.1, 23.0.3, 25.0.0, 25.0.3, 26.0.2, 26.0.3, 27.0.1, 27.0.2
        System Images: android-23 | Intel x86 Atom, android-26 | Google APIs Intel x86 Atom, android-27 | Google APIs Intel x86 Atom
    IDEs:
      Android Studio: 3.1 AI-173.4819257
      Xcode: 10.1/10B61 - /usr/bin/xcodebuild
    npmPackages:
      react: 16.6.1 => 16.6.1
      react-native: 0.57.7 => 0.57.7
    npmGlobalPackages:
      react-native-cli: 2.0.1

Description

Fresh project is unusable with this error:

> npm start
> [email protected] start /Volumes/work/RNUploadSample
> node node_modules/react-native/local-cli/cli.js start

┌──────────────────────────────────────────────────────────────────────────────┐
│                                                                              │
│  Running Metro Bundler on port 8081.                                         │
│                                                                              │
│  Keep Metro running while developing on any JS projects. Feel free to        │
│  close this tab and run your own Metro instance if you prefer.               │
│                                                                              │
│  https://github.com/facebook/react-native                                    │
│                                                                              │
└──────────────────────────────────────────────────────────────────────────────┘

Looking for JS files in
   /Volumes/work/RNUploadSample

Loading dependency graph...(node:36207) UnhandledPromiseRejectionWarning: Error: Cannot find module 'jest-serializer'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:603:15)
    at Function.Module._load (internal/modules/cjs/loader.js:529:25)
    at Module.require (internal/modules/cjs/loader.js:658:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at _load_jestSerializer (/Volumes/work/RNUploadSample/node_modules/jest-haste-map/build/index.js:164:52)
    at HasteMap._persist (/Volumes/work/RNUploadSample/node_modules/jest-haste-map/build/index.js:781:25)
    at _buildPromise._buildFileMap.then.then.hasteMap (/Volumes/work/RNUploadSample/node_modules/jest-haste-map/build/index.js:425:16)
    at process.internalTickCallback (internal/process/next_tick.js:77:7)
(node:36207) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 1)
(node:36207) [DEP0018] DeprecationWarning: Unhandled promise rejections are deprecated. In the future, promise rejections that are not handled will terminate the Node.js process with a non-zero exit code.
(node:36207) UnhandledPromiseRejectionWarning: Error: Cannot find module 'jest-serializer'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:603:15)
    at Function.Module._load (internal/modules/cjs/loader.js:529:25)
    at Module.require (internal/modules/cjs/loader.js:658:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at _load_jestSerializer (/Volumes/work/RNUploadSample/node_modules/jest-haste-map/build/index.js:164:52)
    at HasteMap._persist (/Volumes/work/RNUploadSample/node_modules/jest-haste-map/build/index.js:781:25)
    at _buildPromise._buildFileMap.then.then.hasteMap (/Volumes/work/RNUploadSample/node_modules/jest-haste-map/build/index.js:425:16)
    at process.internalTickCallback (internal/process/next_tick.js:77:7)
(node:36207) UnhandledPromiseRejectionWarning: Unhandled promise rejection. This error originated either by throwing inside of an async function without a catch block, or by rejecting a promise which was not handled with .catch(). (rejection id: 2)

How to reproduce

> react-native init Sample
> cd Sample
> rm -rf yarn.lock node_modules
> npm install
> npm start

Workaround

There is hack to fix this, is adding "jest-haste-map": "23.6.0" to package.json

Before hack (output of npm ls jest-haste-map:

├─┬ [email protected]
│ └─┬ [email protected]
│   ├── [email protected]
│   ├─┬ [email protected]
│   │ └── [email protected]
│   └─┬ [email protected]
│     └── [email protected]
└─┬ [email protected]
  ├─┬ [email protected]
  │ └── [email protected]
  └─┬ [email protected]
    └── [email protected]  deduped

After hack:

├─┬ [email protected]
│ └─┬ [email protected]
│   ├── [email protected]
│   ├─┬ [email protected]
│   │ └── [email protected]
│   └─┬ [email protected]
│     └── [email protected]
├── [email protected]
└─┬ [email protected]
  ├─┬ [email protected]
  │ └── UNMET DEPENDENCY [email protected]
  └─┬ [email protected]
    └── UNMET DEPENDENCY [email protected]

Other info

Potential duplicates: #21146

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

suark · 2018-12-11T18:43:57Z

@vovkasm Which package.json did you add it to? I'm trying to solve something similar. Do you mean react-native's package.json or your projects?

vovkasm · 2018-12-11T18:48:04Z

@suark I have only one package.json file in the root of application folder. That file was initially generated by react-native init command. So yes, it is my projects file.

radetsky · 2018-12-11T18:50:44Z

@vovkasm Which package.json did you add it to? I'm trying to solve something similar. Do you mean react-native's package.json or your projects?

in the root directory of your react-native project.

obshksw · 2018-12-11T19:00:48Z

Weirdly enough, I updated my project from react-native 0.55.4 to 0.57.7 and the error was not occuring.
It started occuring after I deleted my node_modules folder and package-lock.json file.

npm i jest-serializer does "fix" the problem for me though.

suark · 2018-12-11T19:01:59Z

Thanks very much. Currently working for me.

We are using react-native 0.57.5 right now. This fix, or "hack", has worked for us. I don't like not understanding it, but it works...

hramos · 2018-12-11T19:15:48Z

It may have been introduced back in facebook/metro@039dedb. cc @rafeca

brycedeneen · 2018-12-12T13:52:47Z

Same issue for me, and the workaround worked.

kelset · 2018-12-12T14:01:15Z

So, yeah, it's caused by 0.48.3 - I talked with @rafeca a while back and we agreed that 0.48.3 was going to be removed from npm to avoid this issue (basically, this release - as pointed out - requires the wrong version of jest haste map) but it seems that the Metro team never had time to do it 😕

A "cleaner" workaround for now would be to enforce using Metro 0.48.2 via yarn resolutions.

(as an alternative, for 0.57.8, I could do a local commit to the branch to enforce the fixed 0.48.2 without the ^)

Dror-Bar · 2018-12-12T14:54:54Z

How to enforce using Metro 0.48.2 with npm?

kelset · 2018-12-12T16:14:22Z

Ok so I managed to reach out to the Metro team, they just published 0.48.4, which has the same content as 0.48.2, so if you clean up your yarn.lock & node_modules and reinstall it should now install 0.48.4 and the issue reported should not be there anymore.

(Thanks @rafeca!)

vovkasm · 2018-12-12T16:34:21Z

@kelset Perfect! Thank you for fast reaction!

Just run my test case:

> react-native init Sample
> cd Sample
> rm -rf yarn.lock node_modules
> npm install
> npm start

Hmm... something still not good:

npm ls jest-haste-map                                                                                                                                                                             ~/tmp/Sample
[email protected] /Users/vovkasm/tmp/Sample
├─┬ [email protected]
│ └─┬ [email protected]
│   ├── [email protected]
│   ├─┬ [email protected]
│   │ └── [email protected]
│   └─┬ [email protected]
│     └── [email protected]
└─┬ [email protected]
  ├─┬ [email protected]
  │ └── [email protected]
  └─┬ [email protected]
    └── [email protected]  deduped

vovkasm · 2018-12-12T16:39:43Z

Yea unfortunately [email protected] still requires [email protected]

Moreover, tag v0.48.4 even not exists (currently) at github repo, so I can't investigate futher

kelset · 2018-12-12T16:45:24Z

~~uhm :/ Ok I'll ping them again, something must have gone wrong with it... if you use yarn resolutions to enforce 0.48.2 does it solves it for you?~~
(see my latest comment)

rafeca · 2018-12-12T16:45:47Z

Hey @vovkasm! I did the publish manually from a local repo, with the same contents of the version v0.48.2.

I've just pushed the branch to github: https://github.com/facebook/metro/tree/v0.48.x

if the conflicting commit is facebook/metro@039dedb, then it means I'll need to publish another version based on v0.48.1.

Can you confirm that?

kelset · 2018-12-12T16:47:55Z

AH yeah I was about to write the same, by looking at the release notes it seems that 0.48.2 was in fact the one upgrading the jest - I have misremembered 🤦‍♂️

Sorry everyone 🤦‍♂️
So yeah I guess we should do the new version based on 0.48.1 - but I'd prefer to wait for @vovkasm feedback first.

vovkasm · 2018-12-12T16:53:01Z

@rafeca , @kelset
Yes confirm. Seems like https://github.com/facebook/metro/blob/v0.48.x/packages/metro/package.json#L37 still contains dependency on jest 24.0.0-alpha.2
Also v0.48.2: https://github.com/facebook/metro/blob/v0.48.2/packages/metro/package.json#L37

And that one tagged as v0.48.1 didn't:
https://github.com/facebook/metro/blob/v0.48.1/packages/metro/package.json#L37

rafeca · 2018-12-12T16:55:33Z

Ok, thanks! I'm gonna unpublish v0.48.4 and publish v0.48.5 with the contents of v0.48.1

rafeca · 2018-12-12T16:59:52Z

Ok, v0.48.5 has been published, the branch on GH has been updated to point to it: https://github.com/facebook/metro/tree/v0.48.x

vovkasm · 2018-12-12T17:18:38Z

Thanks @rafeca, @kelset! I'm slightly modify test case (because Sample package lives in Libraries folder of react-native project and leads to another conflict in haste :-D )

> react-native init Sample1
> cd Sample1
> rm -rf yarn.lock node_modules
> npm install
> npm start

Now it works as expected! Also I'm tested that application actually run in ios simulator.

Should I close this issue by myself?

kelset · 2018-12-12T17:26:44Z

ok awesome, yeah feel free to close :)

vovkasm · 2018-12-12T17:28:31Z

Close, because issue was resolved by publishing [email protected]

kelset added Tech: Bundler 📦 This issue is related to the bundler (Metro, Haul, etc) used. Impact: Regression Describes a behavior that used to work on a prior release, but stopped working recently. labels Dec 12, 2018

vovkasm closed this as completed Dec 12, 2018

facebook locked as resolved and limited conversation to collaborators Dec 12, 2019

react-native-bot added the Resolution: Locked This issue was locked by the bot. label Dec 12, 2019

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

react-native init generate broken application (dependencies) #22606

react-native init generate broken application (dependencies) #22606

vovkasm commented Dec 11, 2018

suark commented Dec 11, 2018

vovkasm commented Dec 11, 2018 •

edited

Loading

radetsky commented Dec 11, 2018

obshksw commented Dec 11, 2018

suark commented Dec 11, 2018

hramos commented Dec 11, 2018

brycedeneen commented Dec 12, 2018

kelset commented Dec 12, 2018 •

edited

Loading

Dror-Bar commented Dec 12, 2018 •

edited

Loading

kelset commented Dec 12, 2018

vovkasm commented Dec 12, 2018

vovkasm commented Dec 12, 2018

kelset commented Dec 12, 2018 •

edited

Loading

rafeca commented Dec 12, 2018 •

edited

Loading

kelset commented Dec 12, 2018

vovkasm commented Dec 12, 2018

rafeca commented Dec 12, 2018

rafeca commented Dec 12, 2018 •

edited

Loading

vovkasm commented Dec 12, 2018

kelset commented Dec 12, 2018

vovkasm commented Dec 12, 2018

react-native init generate broken application (dependencies) #22606

react-native init generate broken application (dependencies) #22606

Comments

vovkasm commented Dec 11, 2018

Environment

Description

How to reproduce

Workaround

Other info

suark commented Dec 11, 2018

vovkasm commented Dec 11, 2018 • edited Loading

radetsky commented Dec 11, 2018

obshksw commented Dec 11, 2018

suark commented Dec 11, 2018

hramos commented Dec 11, 2018

brycedeneen commented Dec 12, 2018

kelset commented Dec 12, 2018 • edited Loading

Dror-Bar commented Dec 12, 2018 • edited Loading

kelset commented Dec 12, 2018

vovkasm commented Dec 12, 2018

vovkasm commented Dec 12, 2018

kelset commented Dec 12, 2018 • edited Loading

rafeca commented Dec 12, 2018 • edited Loading

kelset commented Dec 12, 2018

vovkasm commented Dec 12, 2018

rafeca commented Dec 12, 2018

rafeca commented Dec 12, 2018 • edited Loading

vovkasm commented Dec 12, 2018

kelset commented Dec 12, 2018

vovkasm commented Dec 12, 2018

vovkasm commented Dec 11, 2018 •

edited

Loading

kelset commented Dec 12, 2018 •

edited

Loading

Dror-Bar commented Dec 12, 2018 •

edited

Loading

kelset commented Dec 12, 2018 •

edited

Loading

rafeca commented Dec 12, 2018 •

edited

Loading

rafeca commented Dec 12, 2018 •

edited

Loading