Expo dependency error, "Cannot find native module 'ExpoCrypto'", in Non-Expo React Native Projects

Aperta
#18 3 commenti 0 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
5/5
Tempo stimato
Più di una settimana
Idoneità per principianti
25/100
Tipo di issue
Bug
Chiarezza
Abbastanza chiara
Stato di attività
Ferma
Stack tecnologico
react-native, typescript
Ambito
mobile

Direzione di ricerca

Riproduci il problema con React Native 0.73.2, cloudinary-react-native 0.2.0 e la configurazione bare project descritta nell’issue. Esamina prima package-lock.json e le dipendenze del package relative a Expo; il lavoro è completato quando l’SDK funziona in un’app React Native bare oppure documenta il workaround richiesto e la configurazione supportata.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

I encountered an issue while integrating the cloudinary-react-native package version 0.2.0 into my bare React Native project. The problem arises due to the package's dependency on ExpoCrypto and other Expo modules, which are not available in a non-Expo (bare) React Native environment.

Steps to Reproduce
  1. Create a new bare React Native project using npx react-native init MyProject.
  2. Install the cloudinary-react-native package using npm install cloudinary-react-native.
  3. Attempt to use the package according to the provided documentation.
  4. Encounter an error related to the missing ExpoCrypto module when running the app.
Expected Behavior

I expected that the cloudinary-react-native package could be used in a bare React Native project without dependencies on Expo-specific modules, or that there would be clear documentation on how to handle such dependencies in a non-Expo environment.

import {Cloudinary} from '@cloudinary/url-gen';
import {upload} from 'cloudinary-react-native';

async function uploadImageToCloudinarySDK(payload: any) {
  const {folder, upload_preset, uri} = payload;

  const cld = new Cloudinary({
    cloud: {cloudName: Config.CLOUDINARY_CLOUD_NAME },
    url: {secure: true},
  });

  const options = {folder, upload_preset, unsigned: true};

  await upload(cld, {
    file: uri,
    options,
    callback: (error: any, response: any) => {
      if (error) {
        console.error('Upload Error:', error);
      } else {
        console.log('Upload Successful:', response);
      }
    },
  }).catch((error: any) => console.log('ERROR CLD UPLOAD', error?.message));
}
Actual Behavior

The application throws an error indicating that the ExpoCrypto native module cannot be found. This suggests that the package relies on Expo modules, which are not present in bare React Native environments. The exact error message is:

Cannot find native module 'ExpoCrypto', js engine: hermes

Environment
  • React Native version: 0.73.2
  • Cloudinary React Native SDK version: 0.2.0
  • Operating System: iOS
  • Device details: iPhone 15 Pro Max
Additional Context

I am not using Expo in my project and prefer to keep it as a bare React Native application. I noticed that the package-lock.json file lists several Expo-related dependencies, which might be causing this issue.

Given the package's potential utility for React Native developers looking to integrate Cloudinary, finding a solution to make it compatible with both Expo and non-Expo environments would be greatly beneficial.

Potential Solutions or Workarounds

I am seeking guidance on how to resolve this issue. Possible solutions could include:

  • Instructions on how to remove or bypass the Expo dependencies in a non-Expo environment.
  • Updates to the package to support bare React Native projects without requiring Expo modules.
  • Any other recommended approaches for using cloudinary-react-native in non-Expo React Native projects.

Thank you for looking into this issue. I appreciate any feedback or solutions you can provide.

Lingua principale
TypeScript
Stelle
28
Fork
21
Metriche di merge delle PR
Nessuna PR unita negli ultimi 30g

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di cloudinary/cloudinary-react-native

Tutte le issue di cloudinary/cloudinary-react-native

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.