Throw an error when used with @expo/electron-adapter

[younes200]

How frequently does the bug occur?

All the time

Description

Hi, I used the template @realm/expo-template-ts with @expo/electron-adapter to run the app with electron runtime, but I'm facing this issue.

Please find reproductible repo here : https://github.com/younes200/expo-electron-realm

Stacktrace & log output

Uncaught /Users/MyAwesomeRealmApp/node_modules/@realm/react/dist/index.js:18
import { createContext } from "react";
       ^

SyntaxError: Unexpected token {
    at new Script (vm.js:83:7)
    at createScript (vm.js:265:10)
    at Object.runInThisContext (vm.js:313:10)
    at Module._compile (internal/modules/cjs/loader.js:712:26)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:798:10)
    at Module.load (internal/modules/cjs/loader.js:645:32)
    at Function.Module._load (internal/modules/cjs/loader.js:560:12)
    at Module.require (internal/modules/cjs/loader.js:685:19)
    at require (internal/modules/cjs/helpers.js:16:16)
    at eval (webpack-internal:///@realm/react:1:18)

Can you reproduce the bug?

Yes, always

Reproduction Steps

yarn electron:start

Version

10.19.0

What SDK flavour are you using?

Local Database only

Are you using encryption?

No, not using encryption

Platform OS and version(s)

macos

Build environment

Which debugger for React Native: ..

Cocoapods version

No response

[younes200]

When adding realm package as external according to https://docs.expo.dev/guides/using-electron/#behavior:

{
  "expo": {
    ...
    "web": {
      "build": {
        "babel": {
          "include": ["realm", "@realm/react"]
        }
      }
    }
  }
}

it throws the error :

Uncaught TypeError: Cannot read property 'indexOf' of undefined
    at Function.getFileName (webpack-internal:///./node_modules/bindings/bindings.js:178)
    at bindings (webpack-internal:///./node_modules/bindings/bindings.js:82)
    at getRealmConstructor (webpack-internal:///./node_modules/realm/lib/index.js:9)
    at eval (webpack-internal:///./node_modules/realm/lib/index.js:35)
    at Object../node_modules/realm/lib/index.js (renderer.js:5482)
    at __webpack_require__ (renderer.js:791)
    at fn (renderer.js:102)
    at eval (webpack-internal:///./node_modules/@realm/react/dist/index.js:20)
    at Object../node_modules/@realm/react/dist/index.js (renderer.js:1431)
    at __webpack_require__ (renderer.js:791)

Any help will be much appreciated. Thank you

[tomduncalf]

@younes200 Are you still experiencing the import { createContext } from "react" error also? We'lll need to do some investigation into the second issue you posted

[younes200]

@tomduncalf after adding the include": ["realm", "@realm/react"] I only get the second error TypeError: Cannot read property 'indexOf' of undefined But I'm not sure it's the right thing to do.

[younes200]

I can confirm the issue is related to importing @realm/react because import realm from "realm" works fine. So we are back to the first issue import { createContext } from "react" SyntaxError: Unexpected token {

[tomduncalf]

Hey @younes200, I was not able to repro this issue, I wonder if your setup is different to mine somehow?

I did the following:

1. Cloned your repo
2. Ran yarn
3. Ran yarn ios, which gave me an error in AppDelegate.m: no visible @interface for 'RCTBundleURLProvider' declares the selector 'jsBundleURLForBundleRoot:fallbackResource:', so I modified this as per this issue: https://github.com/facebook/react-native/issues/33451
4. Ran yarn ios again and it works fine

Perhaps we are on different RN versions? I'm not sure how that could be though.

Could you try deleting your node_modules and reinstalling?

Could you also post the output of npx expo-env-info? Mine is:

  expo-env-info 1.0.5 environment info:
    System:
      OS: macOS 12.4
      Shell: 5.8.1 - /bin/zsh
    Binaries:
      Node: 16.15.1 - ~/.nvm/versions/node/v16.15.1/bin/node
      Yarn: 1.22.19 - ~/.nvm/versions/node/v16.15.1/bin/yarn
      npm: 8.15.0 - ~/.nvm/versions/node/v16.15.1/bin/npm
    Managers:
      CocoaPods: 1.11.3 - /usr/local/bin/pod
    SDKs:
      iOS SDK:
        Platforms: DriverKit 21.4, iOS 15.5, macOS 12.3, tvOS 15.4, watchOS 8.5
      Android SDK:
        Android NDK: 21.0.6113669
    IDEs:
      Android Studio: 2021.2 AI-212.5712.43.2112.8609683
      Xcode: 13.4.1/13F100 - /usr/bin/xcodebuild
    npmPackages:
      @expo/webpack-config: ~0.16.21 => 0.16.27
      expo: ^45.0.0 => 45.0.6
      react: 17.0.2 => 17.0.2
      react-dom: 17.0.2 => 17.0.2
      react-native: 0.68.2 => 0.68.2
      react-native-web: 0.17.7 => 0.17.7
    npmGlobalPackages:
      expo-cli: 6.0.1
    Expo Workflow: bare

[younes200]

Hi @tomduncalf

I didn't check the code on iOS, I'm only testing for electron with : yarn electron:start

Here is my npx expo-env-info output anyway :

expo-env-info 1.0.5 environment info:
    System:
      OS: macOS 12.0.1
      Shell: 5.8 - /bin/zsh
    Binaries:
      Node: 16.16.0 - ~/.nvm/versions/node/v16.16.0/bin/node
      Yarn: 1.22.17 - ~/.yarn/bin/yarn
      npm: 8.11.0 - ~/.nvm/versions/node/v16.16.0/bin/npm
      Watchman: 4.9.0 - /usr/local/bin/watchman
    Managers:
      CocoaPods: 1.11.3 - /usr/local/bin/pod
    SDKs:
      iOS SDK:
        Platforms: DriverKit 21.4, iOS 15.5, macOS 12.3, tvOS 15.4, watchOS 8.5
    IDEs:
      Android Studio: 2021.1 AI-211.7628.21.2111.8193401
      Xcode: 13.4.1/13F100 - /usr/bin/xcodebuild
    npmPackages:
      @expo/webpack-config: ~0.16.21 => 0.16.27 
      expo: ^45.0.0 => 45.0.6 
      react: 17.0.2 => 17.0.2 
      react-dom: 17.0.2 => 17.0.2 
      react-native: 0.68.2 => 0.68.2 
      react-native-web: 0.17.7 => 0.17.7 
    npmGlobalPackages:
      eas-cli: 0.54.1
      expo-cli: 6.0.1
    Expo Workflow: bare

Thank for the feedback.

[kneth]

@younes200 I have tried the following:

git clone [email protected]:younes200/expo-electron-realm.git
cd expo-electron-realm/
yarn install
yarn electron:build

And I don't see any build errors.

[younes200]

@kneth Try to run the app first : yarn electron:start ;) The error usually happens during execution.

[sync-by-unito[bot]]

➤ Younes commented:

@kneth Try to run the app first : yarn electron:start :wink: The error usually happens during execution.

[kneth]

I don't see any errors.

[younes200]

Please check the Console tab :

[kneth]

The error looks much like https://github.com/TooTallNate/node-bindings/issues/50, and I wonder if the workaround outlined in https://github.com/TooTallNate/node-bindings/issues/50#issuecomment-1179479530 will work for you?

[takameyer]

It's been two weeks since the proposed solution. I'm going to close this for now. @younes200 Feel free to reopen if you have any updates and would like us to look into it further.

[younes200]

Hi @kneth, sorry for the delay. the workaround in TooTallNate/node-bindings/issues/50 is not linked the issue and it's only to solve the build issue (when generating the finale a .exe/.apk) which is not the issue here.