App with react-script throws TypeError: can't convert BigInt to number

[friedger]

Describe the bug
When running my app "pool registry" (https://github.com/friedger/stacks-pool-registry) with the 2.0.1 in production, I get the error:
TypeError: can't convert BigInt to number. The app is build using react-script

What version of stack.js are you using?
2.0.1

To Reproduce
Steps to reproduce the behavior:

1. clone the repo
2. yarn
3. yarn build
4. serve -s build

Expected behavior
localhost:5000/hodl should show

Screenshots
If applicable, add screenshots to help explain your problem.

Maybe related to #1096

Additional Context
facebook/create-react-app#6907

[bigclown]

Hey i was trying to solve this exact thing.
Indeed the solution was along the lines of this issue

The thing is, you are going to lose the create-react-app support in both ways. if you eject and add the pollyfills or using react-app-rewired.

i've doing some test and using a fresh New crapp, with a connect button to login , haves the same error. But under dev branch used react-app-rewired and the pollyfills so serve -s build whould work correctly

Before trying this in your proyect read this aditional content See:
Important Comment about the pollyfills needed
Medium article about how to integrate react-app-rewired
react-app-rewired

[dcsan]

Yeah i got exactly this problem and took a while to find it in the minified code.

So we can't build any production stacks apps since a month or so? uhhh... seriously?

import { IntegerType, intToBigInt } from '@stacks/common';
import { ClarityType } from '../clarityValue';

const MAX_U128 = BigInt(2) ** BigInt(128) - BigInt(1);
const MIN_U128 = BigInt(0);
const MAX_I128 = BigInt(2) ** BigInt(127) - BigInt(1);
const MIN_I128 = BigInt(-2) ** BigInt(127);

interface IntCV {
  readonly type: ClarityType.Int;
  readonly value: bigint;
}

const intCV = (value: IntegerType): IntCV => {
  const bigInt = intToBigInt(value, true);
  if (bigInt > MAX_I128) {
    throw new RangeError(
      `Cannot construct clarity integer from value greater than ${MAX_I128.toString()}`
    );
  } else if (bigInt < MIN_I128) {
    throw new RangeError(
      `Cannot construct clarity integer form value less than ${MIN_I128.toString()}`
    );
  }
  return { type: ClarityType.Int, value: bigInt };
};

interface UIntCV {
  readonly type: ClarityType.UInt;
  readonly value: bigint;
}

const uintCV = (value: IntegerType): UIntCV => {
  const bigInt = intToBigInt(value, false);
  if (bigInt < MIN_U128) {
    throw new RangeError('Cannot construct unsigned clarity integer from negative value');
  } else if (bigInt > MAX_U128) {
    throw new RangeError(
      `Cannot construct unsigned clarity integer greater than ${MAX_U128.toString()}`
    );
  }
  return { type: ClarityType.UInt, value: bigInt };
};

export { IntCV, UIntCV, intCV, uintCV };

[dcsan]

for anyone else still here, here's a current fix
#1096 (comment)