How to get access to assets file (issue opened after trouble shooting read).

[TimeForRelax]

Hello!

Firstly I pay your attention, that this issue about trouble shooting topic "get file from assets".

I need to access a file located in the assets folder on an iOS device. Initially, my file was located in the src/assets/react_image.png folder, but I later moved it to the root of the project at ./assets/react_image.png, which did not help. I would like to understand how I can access files because after exploring the bundle folder, I did not find anything resembling my image. I have tried different approaches, both with and without wrap, but nothing has helped. Below, I am attaching all the files that should help to understand the problem.

• please provide the version of installed library and RN project:

  

• a sample code snippet/repository is very helpful to spotting the problem:

  
  import React, {useState} from 'react';
  import {Button, Image, ScrollView, StyleSheet, Text} from 'react-native';
  import ReactNativeBlobUtil from 'react-native-blob-util';

const styles = StyleSheet.create({ container: { flex: 1, padding: 10, backgroundColor: '#e0e0e0', }, text: { fontSize: 20, color: '#333333', }, image: { width: '80%', height: undefined, aspectRatio: 3, marginTop: 20, }, });

export const BlobUtil = () => { // const [data, setData] = useState<string | null>(null);

// const fs = RNFetchBlob.fs;

// console.log(fs.asset('../../assets/react_image.png'));

// RNFetchBlob.fs // .readFile(fs.asset('../../assets/react_image.png'), 'base64') // .then(data => { // console.log(data); // }) // .catch(e => console.log(e));

const [blob, setBlob] = useState(null);

const convertImageToBlob = async () => { try { const url = ReactNativeBlobUtil.wrap( ReactNativeBlobUtil.fs.asset('react_image.png'), ); console.log('jjjjj', url); const imagePath = ReactNativeBlobUtil.fs.asset('react_image.png');

  console.log(imagePath);

  const imageBlob = await ReactNativeBlobUtil.fs.ls(
    'ReactNativeBlobUtil-file://',
  );
  console.log('imageBlob', imageBlob);
  // setBlob(imageBlob);
  // console.log('Image converted to Blob:', imageBlob);
} catch (error) {
  console.error('error:', error);
}

};

return (

root image: Blob data: {blob} {/* */}

); };

[TimeForRelax]

adding my repo here: https://github.com/TimeForRelax/first-react-native-project

[RonRadtke]

You have to use the correct path. You cannot access the files with a relative path. You will have to use ReactNativeBlobUtil.fs.dirs.bundleDir + '/path in the app' when using the library.

Not needed for the image source though.