Amplify-js: Object prototype may only be an Object or null

[almpertis]

After upgrading aws-amplify on a react native expo project i got the following error:
"TypeError: Prototype value can only be an object or null"

[ashika01]

@almpertis Could you provide us with more information. What's your use case, what part of amplify are you using and some sample code if possible?

[almpertis]

This is my package.json

{
  "main": "node_modules/expo/AppEntry.js",
  "scripts": {
    "start": "expo start",
    "android": "expo start --android",
    "ios": "expo start --ios",
    "web": "expo start --web",
    "eject": "expo eject",
    "lint:eslint": "eslint . --ignore-path .gitignore"
  },
  "dependencies": {
    "@aws-amplify/api": "^2.1.3",
    "@aws-amplify/pubsub": "^2.1.3",
    "@react-native-community/masked-view": "^0.1.5",
    "aws-amplify": "^2.2.2",
    "aws-amplify-react-native": "^3.2.0",
    "core-js": "^3.6.4",
    "expo": "~36.0.0",
    "react": "~16.9.0",
    "react-dom": "~16.9.0",
    "react-native": "https://github.com/expo/react-native/archive/sdk-36.0.0.tar.gz",
    "react-native-elements": "^1.2.7",
    "react-native-gesture-handler": "~1.5.0",
    "react-native-maps": "0.26.1",
    "react-native-reanimated": "~1.4.0",
    "react-native-safe-area-context": "0.6.0",
    "react-native-screens": "2.0.0-alpha.12",
    "react-native-web": "~0.11.7",
    "react-navigation": "^4.1.1",
    "react-navigation-stack": "^2.1.1"
  },
  "devDependencies": {
    "@babel/core": "^7.0.0",
    "babel-eslint": "^10.0.3",
    "babel-plugin-styled-components": "^1.10.7",
    "babel-preset-expo": "~8.0.0",
    "eslint": "^6.8.0",
    "eslint-config-airbnb": "^18.0.1",
    "eslint-config-airbnb-base": "^14.0.0",
    "eslint-config-prettier": "^6.10.0",
    "eslint-config-react-app": "^5.1.0",
    "eslint-plugin-flowtype": "^4.6.0",
    "eslint-plugin-import": "^2.20.0",
    "eslint-plugin-jsx-a11y": "^6.2.3",
    "eslint-plugin-prettier": "^3.1.2",
    "eslint-plugin-react": "^7.18.0",
    "eslint-plugin-react-hooks": "^2.3.0",
    "prettier": "^1.19.1"
  },
  "private": true
}

This is the error I am seeing:

Problem was fixed after downgrading to:

"aws-amplify": "1.1.29",
"aws-amplify-react-native": "2.1.13"

There seems to be a problem with predictions and these packages do not have the predictions build in yet.

I am currently only using Auth. But the issue seems to happen on Amplify.configure()

I do not know if it is random or not but I first saw the error when I downloaded my existing amplify project from GitHub and run amplify init on the new machine in order to pull my existing env.
Also on the new machine (macOS Catalina) I configured amplify with the same IAM user I had on the old machine (Windows 10). Again I do not really know if this is relevant.
One other thing I noticed is that when I used amplify init on a brand new project, if I named the env "dev" the amplify push would throw a bunch of errors. Any other name would work just fine.

[almpertis]

@ashika01 is there any documentation where I can find instructions on how to fork aws-amplify and import it locally on my project in order to debug it myself?

[ashika01]

@almpertis I am not sure if this is coming from amplify. But I can help you with local development. There is docs for local development here.

But just fork amplify-js repo then make sure you have yarn. You could then just do some yarn linking on the category to set it up for local. If you have any questions/issues while setting up let me know

[almpertis]

@ashika01 Thank you very much for your quick response :)

[almpertis]

@ashika01 I think so too. I believe that there is a conflict somehow between expo's and amplify's dependencies but the error is not that descriptive (at least for me to understand) :/

[ashika01]

@almpertis Yeah. It quit difficult :/ Could you check if its coming from error.ts if you have local development setup?

[almpertis]

@ashika01 does this error remind you of anything?

The package at "node_modules\crypto-js\core.js" attempted to import the Node standard library module "crypto". It failed because React Native does not include the Node standard library. Read more at https://docs.expo.io/versions/latest/introduction/faq/#can-i-use-nodejs-packages-with-expo

happened by removing @aws-amplify/api & @aws-amplify/pubsub

[almpertis]

I figured it out. Turns out that some packages that come preinstalled with expo can be used without needing to install them first with npm (or yarn). In my case I used one of these packages and the linter would not throw an error. However the app was unable to run when I published my app. So check your imports and your packages. Big thanks to @ashika01 for the great help!

[julianljk]

what did you manage to do to fix this? Were the issues coming from expo libraries?

[andreialecu]

We started seeing the same error while doing a big refactoring.

The error appears to come from here:

Upon debugging with Chrome I can see that b is undefined. That piece of code is generated by typescript.

It's possible something fundamental got broken in the build process, resulting in a broken JS bundle.

Note that we are NOT using Expo at all, and don't have any dependencies to any Expo libs.

[andreialecu]

Also noticed this:

Require cycle: index.js -> main.tsx -> node_modules/aws-amplify/lib/index.js -> node_modules/@aws-amplify/predictions/lib/index.js -> node_modules/@aws-amplify/predictions/lib/Providers/index.js -> node_modules/@aws-amplify/predictions/lib/Providers/AmazonAIConvertPredictionsProvider.js -> node_modules/@aws-amplify/predictions/lib/types/Providers/AbstractConvertPredictionsProvider.js -> index.js

Require cycles are allowed, but can result in uninitialized values. Consider refactoring to remove the need for a cycle.

There are a bunch of require cycle warnings related to amplify libs.

[andreialecu]

Was able to find the problem, it was related to adding module-resolver to babel.config.js in order to allow path aliases in the build.

The babel.config.js file, for reference:

module.exports = {
  presets: ["module:metro-react-native-babel-preset"],
  plugins: [
    ["@babel/plugin-proposal-decorators", { legacy: true }],
    [
      "transform-inline-environment-variables",
      { include: ["NODE_ENV", "IS_STORYBOOK"] }
    ],
    [
      "module-resolver",
      {
        root: ["./"],
        extensions: [
          ".ios.ts",
          ".android.ts",
          ".ts",
          ".ios.tsx",
          ".android.tsx",
          ".tsx",
          ".jsx",
          ".js",
          ".json"
        ],
        alias: {}
      }
    ]
  ]
};

Removing module-resolver from it resulted in getting rid of the error, but we lost the ability to use aliases in imports.

I think if there weren't any require cycles in the amplify code base this problem wouldn't have surfaced.