React-native-windows: Support react-native-fs for RNW vNext

[namrog84]

Cannot read property 'RNFSFileTypeRegular' of undefined

react-native-fs has a RNFSManager which has some constants and other fairly low level stuff.
There is a /windows module but it is using cs and is designed for RNWcurrent and so RNWvNext and it's use of 'uwp' makes this not work.

https://github.com/itinance/react-native-fs/tree/master/windows/RNFS

Also rn-fetch-blob doesn't have windows support. And it is sorta related to file system things.
https://github.com/joltup/rn-fetch-blob

[harinikmsft]

Thanks for trying this out. We are currently in the middle of providing the native modules/view managers story for targeting RNW-vnext. So, any of the community modules that need this story will not currently support RNW-vnext yet. Once this story is ready, we would love to get some help making these community modules work against RNW -vnext.

Stay tuned for updates!

[stmoy]

https://github.com/itinance/react-native-fs/pull/868

[namrog84]

Unfortunately that looks like its C# only at the moment :(

But I am super glad any progress is being done on it!

[gillpeacegood]

Yeah I made that change. Really aimed for the quickest and easiest port of the old windows version.

Now I think about it much of react-native-fs could probably be implemented with standard c++ library functionality and also the ios and android implementations could potentially use that (maybe via turbo modules?)

[harshadak2020]

+1 Another AppConsult customer is asking for this in order to move their project from the legacy C# core to the new C++ one

[vmoroz]

Just to provide an update here. @avmoroz is doing a "virtual internship" this summer. The react-native-fs for RNW is almost done. He just needs to complete file upload (download works), and do some clean up such as moving files to the right place. He has also implemented unit tests and a small demo app. See: https://github.com/avmoroz/react-native-fs/tree/dev

[penx]

thanks for the update! Any chance this will also be in react native for mac?

[exotexot]

@vmoroz Really appreciate the work from @avmoroz for RNFS. I tested his demo app and it works well! Unfortunately not just the upload, but also the download is missing. Do you know when those feature will be available? I'm really needing this! :)

[exotexot]

As this is the only channel I see to reach ot to @vmoroz and @avmoroz: have you tried reading larger files?
Maybe you can get yourself a 100mb file and try to use readFile() on it. I'm getting a Promise rejection "Failed to read file."

Further investigation showed that there is a problem memory allocation problem:
Exception thrown at 0x761F40B2 in project.exe: Microsoft C++ exception: std::bad_alloc at memory location 0x00FCCEE0.

To crash also leads me to base.h Line 2658, to the shared_hstring_header method. It Appears that the header variable inherits a falsey value, leading to the crash.

Moreover, I also find that the copyFile and moveFile mehtod of RNFS isnt working for any file in my case.
I'm running on react-native 0.62.2 and react-native-windows 0.62.7

System:
OS: Windows 10 10.0.18362
CPU: (8) x64 Intel(R) Core(TM) i7-7700 CPU @ 3.60GHz
Memory: 6.54 GB / 15.97 GB
Binaries:
Node: 12.9.1 - C:\Program Filesnodejsnode.EXE
Yarn: 1.22.4 - C:\Program Files (x86)\Yarn\binyarn.CMD
npm: 6.10.2 - C:\Program Filesnodejsnpm.CMD
Watchman: Not Found
SDKs:
Android SDK: Not Found
Windows SDK:
AllowDevelopmentWithoutDevLicense: Enabled
AllowAllTrustedApps: Enabled
Versions: 10.0.18362.0, 10.0.19041.0
IDEs:
Android Studio: Not Found
Visual Studio: 16.6.30128.74 (Visual Studio Community 2019)
Languages:
Java: Not Found
Python: Not Found
npmPackages:
@react-native-community/cli: ^4.12.0 => 4.12.0
react: 16.11.0 => 16.11.0
react-native: ^0.62.0-0 => 0.62.2
npmGlobalPackages:
react-native: Not Found
[email protected]

[avmoroz]

Hi exotexot,

I took a look at your issue and tried using readFile(), copyFile(), and moveFile() with a 1.21gb ISO file, and wasn't running into those issues, but I want to investigate your issue further.

Based on the information provided, my first guess is that there are some issues with the arguments passed to the to rnfs. If it's possible, I'd like to try and get some more information about what types of files you were passing and how these methods are being called. For example, I know that using readFile with .7z files leads to a strange hang.

If you would like to contact me about this on something other than Github, feel free to send a message to my Appa#5329 on Discord.

[exotexot]

Hi @avmoroz,
I've send you a friend-request on discord. Ill try and be online for the next days in order to catch you eventually.

But to push this further:
I can reproduce the error I was describing by using your Demo app found here: https://github.com/avmoroz/react-native-fs/tree/dev by reading the 100MB.bin file found here: https://speed.hetzner.de/ as a base64 encoded string.

Running a Debug/x86 build, I'm getting this error:
Exception thrown at 0x772944C2 in RNFSWinV2.exe: Microsoft C++ exception: std::bad_alloc at memory location 0x07B4D248.

[mudaligekosala]

Hi @avmoroz, @exotexot I tried to add your project to my existing application,
yarn add https://github.com/avmoroz/react-native-fs.git#dev
pch.h file

include "winrt/RNFSWinV2.h"

App.cpp
PackageProviders().Append(winrt::RNFSWinV2::ReactPackageProvider());

are these steps correct? I am getting these errors

Severity Code Description Project File Line Suppression State
Error (active) E0135 namespace "winrt::RNFSWinV2" has no member "ReactPackageProvider" UCMobileApp C:\Projects\mobile-app\UCApp\windows\UCMobileApp\App.cpp 50

[exotexot]

Sorry I must have overseen this.

I'm not using RNFS like you described.
I copied RNFSManager.cpp + RNFSManager.h to:
projectname/windows/projectname/ - folder (where e.g. your App.cpp is located).

Then add them also to your solution file in VS

UPDATE:

1. And also make sure to remove those entries in pch.h and App.cpp
2. Not sure if this is relevant but try and select RNFSManager.cpp + RNFSManager.h in the solution explorer and in their properties set "Include in Project" to true.

[mudaligekosala]

Sorry I must have overseen this.

I'm not using RNFS like you described.
I copied RNFSManager.cpp + RNFSManager.h to:
projectname/windows/projectname/ - folder (where e.g. your App.cpp is located).

Then add them also to your solution file in VS

And also make sure to remove those entries in pch.h and App.cpp

@exotexot ,Do i need to install rnfs lib using yarn add https://github.com/avmoroz/react-native-fs.git#dev or just copy past the files.
Can correct me if i am wrong here ,
Solution Explore -Right click on solution =>Add=> Existing Item

[exotexot]

,Do i need to install rnfs lib using yarn add https://github.com/avmoroz/react-native-fs.git#dev

Yes. Because the package provides the mapping of react-native functions to the native c++ code.

Solution Explore -Right click on solution =>Add=> Existing Item

Thats correct!

EDIT:

Do not add the .cpp +.h to the solution but to the project within your solution with your projectname (Universal Windows) - which references e.g. C:\Projects\mobile-app\UCApp\windows\UCMobileApp\UCMobileApp.vcxproj

[exotexot]

I may also need to add that im running react-native 0.62.2 and react-native windows 0.62.12

[mudaligekosala]

I may also need to add that im running react-native 0.62.2 and react-native windows 0.62.12
This is my packages,
"dependencies": { "react": "16.11.0", "react-native": "^0.62.0-0", "react-native-fs": "https://github.com/avmoroz/react-native-fs.git#dev", "react-native-windows": "^0.62.0-0" }
then i added those 2 file to my app'swindows/appName,
this is my Solution Explorer

but still getting

[exotexot]

You located the files correctly but made the wrong reference. Sorry, I've corrected my previous post.

Do not add the .cpp +.h to the solution but to the project within your solution with your projectname (Universal Windows) - which references e.g. C:\Projects\mobile-app\UCApp\windows\UCMobileApp\UCMobileApp.vcxproj

Like so:

[mudaligekosala]

@exotexot Thank you very much for your help. This is working as expected now.