expo@40 support

[vjpr]

Just an issue to track expo + pnpm support.

Working example (Apr 2021)

TODO

https://github.com/vjpr/pnpm-expo-example

Versions

See here for Expo versioning guide: http://docs.expo.io/versions/latest/sdk/index.html#sdk-version

Expo SDK = 40.0.0
React Native = 0.63.3

Installed versions

$ pnpm why metro

@react-native-community/cli 4.14.0
metro 0.59.0

$ pnpm why jest-haste-map

jest-haste-map 24.9.0

Github Issues

Previous pnpm+expo notes:

• expo@31 support #1501
• expo@37 support #2622
• expo@39 support #3010

Metro:

• SHA-1 for file ... is not computed

Reference

https://dev.to/expo/expo-sdk-40-is-now-available-1in0

Summary

Difficulty arose when trying to support react-native@0.64 and expo@40 which only supports react-native@0.59. There were many clashes which can be seen below.

I managed to resolve them all, which now means you can have Expo projects in the same repo as latest react-native.

Will look to publish a working repo eventually.

[vjpr]

SHA-1 for file ... is not computed

The SHA-1 for file ... is not computed issue regarding globbing dotfiles was fixed in jest-haste-map@26.0.0 but unfortunately we are still on jest-haste-map@24.9.0 with expo@40.

Workaround

NOTE: You need pnpm@6 to allow pinning version of override.

package.json

  "pnpm": {
    "overrides": {
      "jest-haste-map@24.9.0": "npm:@vjpr/jest-haste-map@24.9.0"
    }
  }

Versioning

You must ensure same version of metro is being used. This can be difficult if using two versions of metro in your codebase...

error: TypeError: Cannot read property 'transformFile' of undefined

{
  error: TypeError: Cannot read property 'transformFile' of undefined
      at /Users/Vaughan/dev-mono/thirtyfive/node_modules/.pnpm/metro@0.59.0/node_modules/metro/src/Bundler.js:91:34
      at Generator.next (<anonymous>)
      at asyncGeneratorStep (/Users/Vaughan/dev-mono/thirtyfive/node_modules/.pnpm/metro@0.59.0/node_modules/metro/src/Bundler.js:14:24)
      at _next (/Users/Vaughan/dev-mono/thirtyfive/node_modules/.pnpm/metro@0.59.0/node_modules/metro/src/Bundler.js:34:9)
      at processTicksAndRejections (internal/process/task_queues.js:97:5),
  type: 'bundling_error'
}

Fix

metro.config.js

{
  // See: https://github.com/facebook/metro/blob/v0.59.0/packages/metro-config/src/defaults/index.js#L128
  transformerPath: require.resolve('metro/src/JSTransformer/worker.js')
}

UnableToResolveError: Unable to resolve module metro/src/lib/bundle-modules/HMRClient

  error: UnableToResolveError: Unable to resolve module metro/src/lib/bundle-modules/HMRClient from /Users/Vaughan/dev-mono/thirtyfive/node_modules/.pnpm/@github.com+expo+react-native+archive@sdk-40.0.1.tar.gz_react@16.13.1/node_modules/react-native/Libraries/Utilities/HMRClient.js: metro/src/lib/bundle-modules/HMRClient could not be found within the project or in these directories:
    ../../../../../node_modules/.pnpm/@github.com+expo+react-native+archive@sdk-40.0.1.tar.gz_react@16.13.1/node_modules/react-native/node_modules
    ../../../../../node_modules/.pnpm/@github.com+expo+react-native+archive@sdk-40.0.1.tar.gz_react@16.13.1/node_modules
    ../../../../../node_modules/.pnpm/node_modules
    ../../../../../node_modules
    ../../../../../../../node_modules

/xxx/node_modules/.pnpm/@github.com+expo+react-native+archive@sdk-40.0.1.tar.gz_react@16.13.1/node_modules/react-native/Libraries/Utilities/HMRClient.js

const MetroHMRClient = require('metro/src/lib/bundle-modules/HMRClient');

metro is not a dep of react-native - classic unflattened problem.

This seems to be removed in 0.64.

I added a pnpmfile fix.

  if (pkg.name === 'react-native') {
    if (pkg.version === '0.63.2') {
      pkg.dependencies = {
        ...pkg.dependencies,
        metro: '^0.59.0',
      }
    }
  }

You must then run:

cd path/to/package
pnpm update react-native --depth=99

[electroheadfx]

I have not sucess to make react-native with pnpm, I dont understand how to fix it in this thread.

thanks

[vjpr]

@electroheadfx Does https://github.com/vjpr/pnpm-expo-example work for you?

[electroheadfx]

thanks @vjpr, yes I did on the package/expo, the compilation is very verbose, how I can uncheck it ? Iam not sure to understand the purpose of package/pnpm-expo-helper. Great from you

[vjpr]

Closing for #3731