TypeError: Cannot read property 'isTypedArray' of undefined, js engine: hermes
Hi, I want to perform tensor calculation in my React Native project so I have added this package. This is my package.json file:
{
"name": "TFVisionCamera",
"version": "0.0.1",
"private": true,
"scripts": {
"android": "react-native run-android",
"ios": "react-native run-ios",
"lint": "eslint .",
"start": "react-native start",
"test": "jest"
},
"dependencies": {
"@react-native-async-storage/async-storage": "^2.1.0",
"@react-native-masked-view/masked-view": "^0.3.2",
"@tensorflow/tfjs": "^4.22.0",
"@tensorflow/tfjs-core": "^4.22.0",
"@tensorflow/tfjs-react-native": "^1.0.0",
"expo": "^52.0.0",
"expo-camera": "^16.0.9",
"expo-gl": "^15.0.2",
"expo-modules-core": "^2.1.1",
"lodash": "^4.17.21",
"react": "18.3.1",
"react-native": "0.76.3",
"react-native-fast-opencv": "^0.3.3",
"react-native-fast-tflite": "^1.5.0",
"react-native-fs": "^2.20.0",
"react-native-reanimated": "^3.16.5",
"react-native-vision-camera": "^4.6.1",
"react-native-vision-camera-face-detector": "^1.7.1",
"react-native-worklets-core": "^1.5.0",
"vision-camera-resize-plugin": "^3.1.0"
},
"devDependencies": {
"@babel/core": "^7.25.2",
"@babel/preset-env": "^7.25.3",
"@babel/runtime": "^7.25.0",
"@react-native-community/cli": "15.0.1",
"@react-native-community/cli-platform-android": "15.0.1",
"@react-native-community/cli-platform-ios": "15.0.1",
"@react-native/babel-preset": "0.76.3",
"@react-native/eslint-config": "0.76.3",
"@react-native/metro-config": "0.76.3",
"@react-native/typescript-config": "0.76.3",
"@types/lodash": "^4.17.13",
"@types/react": "^18.2.6",
"@types/react-test-renderer": "^18.0.0",
"babel-jest": "^29.6.3",
"eslint": "^8.19.0",
"jest": "^29.6.3",
"prettier": "2.8.8",
"react-test-renderer": "18.3.1",
"typescript": "5.0.4"
},
"engines": {
"node": ">=18"
}
}
This is my App.tsx:
import * as tf from '@tensorflow/tfjs';
import '@tensorflow/tfjs-react-native';
import React, { useCallback, useEffect, useState } from 'react';
import { Button, Text, View } from 'react-native';
const App = () => {
const [isTfReady, setIsTfReady] = useState(false);
const loadTFLibrary = useCallback(async () => {
await tf.ready();
console.log('Tensorflow is ready');
setIsTfReady(true);
}, []);
useEffect(() => {
loadTFLibrary();
}, [loadTFLibrary]);
const printTensor = () => {
if (!isTfReady) {
console.log('Tensorflow is not ready');
return;
}
const ten = tf.zeros([2,2]) // This line works properly
const tens = tf.tensor1d([2], 'float32'); // getting the error here "TypeError: Cannot read property 'isTypedArray' of undefined, js engine: hermes"
};
return (
<View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
<Text>App_Barebone</Text>
<Button title="Press me" onPress={printTensor} />
</View>
);
};
export default App;
When I just run const ten = tf.zeros([2,2]) it runs properly and generates a proper tensor.
Now I want to make my custom tensor from the data I provide with an array. At that time, I am getting the above-mentioned error. I have tried with float32, int32, bool, complex64 and string as well but nothing seems to work.
This is information about my system and which versions I am running for different packages:
System:
OS: macOS 15.1.1
CPU: (8) arm64 Apple M1
Memory: 111.91 MB / 16.00 GB
Shell:
version: "5.9"
path: /bin/zsh
Binaries:
Node:
version: 22.10.0
path: /opt/homebrew/bin/node
Yarn:
version: 1.22.18
path: /opt/homebrew/bin/yarn
npm:
version: 10.9.0
path: /opt/homebrew/bin/npm
Watchman:
version: 2024.11.04.00
path: /opt/homebrew/bin/watchman
Managers:
CocoaPods:
version: 1.15.2
path: /Users/kuldip/.rbenv/shims/pod
SDKs:
iOS SDK:
Platforms:
- DriverKit 24.2
- iOS 18.2
- macOS 15.2
- tvOS 18.2
- visionOS 2.2
- watchOS 11.2
Android SDK:
API Levels:
- "31"
- "33"
- "34"
- "35"
Build Tools:
- 30.0.3
- 33.0.0
- 33.0.1
- 34.0.0
- 35.0.0
System Images:
- android-35 | Google Play ARM 64 v8a
Android NDK: Not Found
IDEs:
Android Studio: 2024.2 AI-242.23339.11.2421.12550806
Xcode:
version: 16.2/16C5032a
path: /usr/bin/xcodebuild
Languages:
Java:
version: 17.0.11
path: /Users/kuldip/.sdkman/candidates/java/current/bin/javac
Ruby:
version: 3.2.2
path: /Users/kuldip/.rbenv/shims/ruby
npmPackages:
"@react-native-community/cli":
installed: 15.0.1
wanted: 15.0.1
react:
installed: 18.3.1
wanted: 18.3.1
react-native:
installed: 0.76.3
wanted: 0.76.3
react-native-macos: Not Found
npmGlobalPackages:
"*react-native*": Not Found
Android:
hermesEnabled: true
newArchEnabled: true
iOS:
hermesEnabled: true
newArchEnabled: false
I am not sure if I am missing anything or doing anything wrong. Any help will be greatly appreciated
Hi @kuldip-simform ,
I was able to run the code snippet you provided. It successfully creates tensors, and when running on a browser, it prints the tensor values.
here is my package.json file.
"@expo/metro-runtime": "~3.2.3",
"@tensorflow/tfjs": "^4.21.0",
"@tensorflow/tfjs-react-native": "^1.0.0",
"expo": "~51.0.28",
"expo-status-bar": "~1.12.1",
"react": "18.2.0",
"react-dom": "18.2.0",
"react-native": "0.74.5",
"react-native-web": "~0.19.10"
Can you try with these dependencies that I am using. Also, clear your cache using npm cache clean --force after deleting your node_modules folder.
Let me know if it works. Thank you!
@shmishra99 Thank you for your response. I will try with this packages version
Hi guys my package version is:
"@tensorflow/tfjs": "^4.22.0", "@tensorflow/tfjs-react-native": "^1.0.0"
And i am facing same issue.
@Tarun24RN Can you let me know what is your react-native and expo version. it would be better if you share whole package.json.
I am too having this issue and not able to find solution.
@Tarun24RN Can you let me know what is your
react-nativeandexpoversion. it would be better if you share whole package.json. I am too having this issue and not able to find solution.
Yes,Here is my package.json dependencies:-
"dependencies": { "@ptomasroos/react-native-multi-slider": "^2.2.2", "@react-native-async-storage/async-storage": "^2.0.0", "@react-native-community/blur": "^4.4.1", "@react-native-community/datetimepicker": "^8.2.0", "@react-native-community/image-editor": "^4.2.1", "@react-native-community/masked-view": "^0.1.11", "@react-navigation/bottom-tabs": "^6.6.1", "@react-navigation/drawer": "^6.7.2", "@react-navigation/native": "^6.1.18", "@react-navigation/native-stack": "^6.11.0", "@reduxjs/toolkit": "^2.3.0", "@shopify/react-native-skia": "^1.5.3", "@tensorflow/tfjs": "^4.21.0", "@tensorflow/tfjs-react-native": "^1.0.0", "axios": "^1.7.7", "base64-arraybuffer": "^1.0.2", "expo": "^51.0.0", "expo-asset": "^11.0.1", "expo-camera": "^16.0.10", "expo-file-system": "^18.0.6", "expo-gl": "^15.0.2", "i": "^0.3.7", "i18next": "^23.16.4", "moment": "^2.30.1", "npm": "^10.9.0", "patch-package": "^8.0.0", "react": "18.3.1", "react-i18next": "^15.1.0", "react-native": "0.75.4", "react-native-create-thumbnail": "^2.0.0", "react-native-device-info": "^14.0.0", "react-native-draggable": "^3.3.0", "react-native-fast-image": "^8.6.3", "react-native-fast-opencv": "^0.3.4", "react-native-fast-tflite": "^1.5.1", "react-native-fs": "^2.20.0", "react-native-gesture-handler": "^2.20.2", "react-native-image-colors": "^1.5.2", "react-native-image-crop-picker": "^0.41.4", "react-native-image-dominant-color": "^1.0.1", "react-native-insta-story": "^1.1.9", "react-native-keyboard-aware-scroll-view": "^0.9.5", "react-native-material-ripple": "^0.9.1", "react-native-mentionable-textinput": "^1.2.0", "react-native-modal-datetime-picker": "^18.0.0", "react-native-new-snap-carousel": "^3.9.3", "react-native-otp-entry": "^1.7.3", "react-native-permissions": "^5.1.0", "react-native-photo-manipulator": "^1.9.1", "react-native-raw-bottom-sheet": "^3.0.0", "react-native-reanimated": "^3.16.1", "react-native-responsive-dimensions": "^3.1.1", "react-native-responsive-fontsize": "^0.5.1", "react-native-safe-area-context": "^4.11.1", "react-native-screens": "^3.34.1", "react-native-svg": "^15.8.0", "react-native-svg-transformer": "^1.5.0", "react-native-toast-message": "^2.2.1", "react-native-video": "^6.8.0", "react-native-view-more-text": "^2.2.0", "react-native-view-shot": "^3.8.0", "react-native-vision-camera": "4.6.1", "react-native-vision-camera-face-detector": "^1.7.1", "react-native-worklets-core": "^1.3.3", "react-redux": "^9.1.2", "redux-persist": "^6.0.0", "vision-camera-resize-plugin": "^3.2.0" },
@Tarun24RN I had react-native-cli project and then I have added expo modules to run this library as it depends on expo modules. Have you done similar to this ? @shmishra99 Can this be cause of this issue ?
@Tarun24RN I had react-native-cli project and then I have added expo modules to run this library as it depends on expo modules. Have you done similar to this ? @shmishra99 Can this be cause of this issue ?
Yes, I have done same process.
@kuldip-simform I found one file inside node-modules>@tensorflow>tjfs-react-native>dist
export class PlatformReactNative {
/**
* Makes an HTTP request.
*
* see @fetch docs above.
*/
async fetch(path, init, options) {
return fetch(path, init, options);
}
/**
* Encode the provided string into an array of bytes using the provided
* encoding.
*/
encode(text, encoding) {
// See https://www.w3.org/TR/encoding/#utf-16le
if (encoding === 'utf-16') {
encoding = 'utf16le';
}
return new Uint8Array(Buffer.from(text, encoding));
}
/** Decode the provided bytes into a string using the provided encoding. */
decode(bytes, encoding) {
// See https://www.w3.org/TR/encoding/#utf-16le
if (encoding === 'utf-16') {
encoding = 'utf16le';
}
return Buffer.from(bytes).toString(encoding);
}
now() {
//@ts-ignore
if (global.nativePerformanceNow) {
//@ts-ignore
return global.nativePerformanceNow();
}
return Date.now();
}
setTimeoutCustom() {
throw new Error('react native does not support setTimeoutCustom');
}
isTypedArray(a) {
return a instanceof Float32Array || a instanceof Int32Array ||
a instanceof Uint8Array || a instanceof Uint8ClampedArray;
}
}
May be because of this code tf.env().registerFlag('IS_REACT_NATIVE', () => navigator && navigator.product === 'ReactNative'); if (tf.env().getBool('IS_REACT_NATIVE')) { setupGlobals(); registerWebGLBackend(); tf.setPlatform('react-native', new PlatformReactNative()); } May be it is throwing error as navigator.product is deprecated @shmishra99 ?
@Tarun24RN Maybe. This can be cause for this. I currently do not have project run. Can you try changing that and check if it solves issue? also can you format this code properly in comment? you can add 3 backtick (`) then in new line add 3 backtick again and then add code between then so it is more readable to all in this thread.
code goes here
Thank you.
tf.env().registerFlag('IS_REACT_NATIVE', () => navigator && navigator.product === 'ReactNative');
I have tried by temporarily removing this check navigator.product === 'ReactNative' and then i rebuild the app but the error remain the same.
Getting the same error while trying to use cameraWithTensors from tfjs-react-native. Seems to be a compatability issue between packages:
https://github.com/expo/expo/issues/30060
https://github.com/tensorflow/tfjs/issues/8100
Im getting the same error on android: Here is my package.json file:
"dependencies": {
"@expo/config-plugins": "~7.2.2",
"@expo/vector-icons": "^13.0.0",
"@react-native-async-storage/async-storage": "1.18.2",
"@react-native-picker/picker": "2.4.10",
"@react-navigation/bottom-tabs": "^6.5.9",
"@react-navigation/native": "^6.1.8",
"@react-navigation/native-stack": "^6.9.14",
"@remobile/react-native-toast": "file:lib/@remobile/react-native-toast",
"@tensorflow-models/coco-ssd": "^2.2.3",
"@tensorflow/tfjs": "^4.22.0",
"@tensorflow/tfjs-react-native": "^1.0.0",
"@types/react": "~18.2.14",
"@viro-community/react-viro": "2.40.1",
"base-64": "^1.0.0",
"expo": "~49.0.11",
"expo-asset": "~8.10.1",
"expo-build-properties": "~0.8.3",
"expo-camera": "~13.4.4",
"expo-checkbox": "~2.4.0",
"expo-dev-client": "~2.4.13",
"expo-font": "~11.4.0",
"expo-gl": "~13.0.1",
"expo-image": "~1.3.5",
"expo-screen-orientation": "~6.0.6",
"expo-splash-screen": "~0.20.5",
"expo-status-bar": "~1.6.0",
"jpeg-js": "^0.4.4",
"react": "18.2.0",
"react-native": "0.72.10",
"react-native-base64": "^0.2.1",
"react-native-ble-plx": "^3.2.1",
"react-native-fs": "^2.20.0",
"react-native-permissions": "^4.1.5",
"react-native-safe-area-context": "4.6.3",
"react-native-screens": "~3.22.0",
"react-native-svg": "^13.14.1",
"react-native-svg-transformer": "^1.1.0",
"react-native-webview": "13.2.2",
"typescript": "~5.3.3"
},
"devDependencies": {
"@babel/core": "^7.20.0"
},
hey any update on this as i am still getting
{ "name": "globsearch", "version": "0.0.1", "private": true, "scripts": { "android": "react-native run-android", "ios": "react-native run-ios", "lint": "eslint .", "start": "react-native start", "test": "jest", "postinstall": "patch-package" }, "dependencies": { "@react-native-documents/picker": "^10.1.5", "@react-native/new-app-screen": "^0.80.1", "@react-navigation/native": "^7.1.14", "@react-navigation/native-stack": "^7.3.21", "@react-navigation/stack": "^7.4.2", "@tensorflow/tfjs": "^3.20.0", "@tensorflow/tfjs-backend-cpu": "^3.20.0", "@tensorflow/tfjs-backend-webgl": "^3.20.0", "@tensorflow/tfjs-react-native": "^1.0.0", "numjs": "^0.16.1", "react": "19.1.0", "react-native": "0.80.1", "react-native-fast-tflite": "^1.6.1", "react-native-fs": "^2.20.0", "react-native-pdf-lib": "^1.0.0", "react-native-safe-area-context": "^5.5.2", "react-native-screens": "^4.13.1", "react-native-sqlite-storage": "^6.0.1" }, "devDependencies": { "@babel/core": "^7.25.2", "@babel/preset-env": "^7.25.3", "@babel/runtime": "^7.25.0", "@react-native-community/cli": "19.0.0", "@react-native-community/cli-platform-android": "19.0.0", "@react-native-community/cli-platform-ios": "19.0.0", "@react-native/babel-preset": "0.80.1", "@react-native/eslint-config": "0.80.1", "@react-native/metro-config": "0.80.1", "@react-native/typescript-config": "0.80.1", "@types/jest": "^29.5.13", "@types/react": "^19.1.0", "@types/react-test-renderer": "^19.1.0", "eslint": "^8.19.0", "jest": "^29.6.3", "patch-package": "^8.0.0", "postinstall-postinstall": "^2.1.0", "prettier": "2.8.8", "react-test-renderer": "19.1.0", "typescript": "5.0.4" }, "engines": { "node": ">=18" } }