React Native (Android) Syntax Error 6.9.2

[Kiruse]

What Happens

A [SyntaxError: No identifiers allowed directly after numeric literal] occurs without stack trace upon importing API library.

Expected Behavior

Library imports without error.

Steps to Reproduce

Create basic & empty app using:

$ yarn create react-native-app

Then, prepare shims:

$ yarn add babel-plugin-module-resolver buffer events crypto-browserify stream-browserify

Modify babel.config.js to add shims:

module.exports = function(api) {
  api.cache(false);
  return {
    presets: ['expo'],
    plugins: [
      'react-native-reanimated/plugin',
      ['module-resolver', {
        root: ['.'],
        alias: {
          'crypto': 'crypto-browserify',
          'stream': 'stream-browserify',
        }
      }],
    ],
  };
};

Finally, import { ApiPromise } from '@polkadot/api' in App.js & run yarn android. RN's Metro fails to bundle with given Syntax Error.

Note

This error does not occur in API version 6.0.5. Due to the size of the monorepo it is hard to pinpoint the exact cause.

[jacogr]

Needle in a haystack :) Try this approach facebook/metro#681

EDIT: So the literal format is used quite a bit in the source, but it does get transformed, so unsure about where it comes from (sadly RN is lagging here with the above PR open for ages now, it is valid syntax). For instance, for transformation in the build step. This

https://github.com/polkadot-js/common/blob/master/packages/util/src/bn/consts.ts#L90-L94

Gets transformed to

/**
 * @name BN_BILLION
 * @summary BN constant for 1,000,000,000.
 */

export const BN_BILLION = new BN(1000000000);

In the packaged output. So changes are high it is from a dependency along the way.

[Kiruse]

Indeed, lack of a stack trace makes this nearly impossible to debug... 😅 I hadn't even thought about numeric separators yet. Didn't seem to fix the issue, nonetheless.

My primary intention was to let fellow devs know that there is a working version for RN. May try to pinpoint the introducing version this evening, if I remember.

[jacogr]

The other thing could be this -

https://github.com/polkadot-js/common/tree/master/packages/util/src/bi

e.g. 123n could be seen as "funny" syntax, for instance here https://github.com/polkadot-js/common/blob/master/packages/util/src/bi/sqrt.ts#L33

It is not used anywhere in the API at this point in time, but it is exported in @polkadot/util from the index.js file.

Parsing should be fixable with https://babeljs.io/docs/en/babel-plugin-syntax-bigint

[Kiruse]

I have to redact my prior statement. Version 6.0.5 also doesn't work. Which further supports the hypothesis that a downstream dependency changed...
babel-plugin-syntax-bigint also had no apparent effect.

[gre]

We're having the same issue, even in a electron/node environment. related to usage of bigint which isn't a technology really ready to use IMO, not all JavaScript engine support it yet as of today.

we have this error:

Do not know how to serialize a BigInt

LedgerHQ/ledger-live-common#1537

this is very important for polkadot library to try to preserve a stable version / long term support🤞

[jacogr]

@gre Yours is a separate issue, so let's not cross lines line and keep it on the RN issue above. In your case, would be interested to know where it throws that, since the bigints are not used in the released version, only exported. With that in-mind, please log a separate issue so we keep things on-point and provide all info appropriate.

[Systerr]

Sadly both JSCore and Hermes still have no support of BigInt
Temporary solution for now for yarn: pin versions without bigints inside package.json

  "dependencies": {
        "@polkadot/api": "6.7.2",
        "@polkadot/types": "6.7.2",
        "@polkadot/util": "7.8.2",
        "@polkadot/util-crypto": "7.8.2"
    },
    "resolutions": {
        "@polkadot/keyring": "7.8.2",
        "@polkadot/util": "7.8.2",
        "@polkadot/util-crypto": "7.8.2"
  }

[jacogr]

Closing as duplicate (although this one was logged first) of #1245 (which has tracking and replication information)

[polkadot-js-bot]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue if you think you have a related problem or query.