react-native-windows icon indicating copy to clipboard operation
react-native-windows copied to clipboard

Support react-native-fs for RNW vNext

Open namrog84 opened this issue 5 years ago • 29 comments

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

namrog84 avatar Jul 25 '19 21:07 namrog84

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!

harinikmsft avatar Jul 31 '19 19:07 harinikmsft

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

stmoy avatar Mar 23 '20 19:03 stmoy

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

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

namrog84 avatar Mar 23 '20 23:03 namrog84

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?)

gillpeacegood avatar Mar 24 '20 11:03 gillpeacegood

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

harshadak2020 avatar May 12 '20 05:05 harshadak2020

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

vmoroz avatar Aug 19 '20 17:08 vmoroz

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

penx avatar Aug 19 '20 17:08 penx

@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 avatar Sep 01 '20 09:09 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 Files\nodejs\node.EXE Yarn: 1.22.4 - C:\Program Files (x86)\Yarn\bin\yarn.CMD npm: 6.10.2 - C:\Program Files\nodejs\npm.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]

exotexot avatar Sep 10 '20 13:09 exotexot

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.

avmoroz avatar Sep 11 '20 22:09 avmoroz

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.

exotexot avatar Sep 15 '20 15:09 exotexot

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

mudaligekosala avatar Oct 14 '20 05:10 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

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.

exotexot avatar Oct 15 '20 21:10 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

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

mudaligekosala avatar Oct 15 '20 21:10 mudaligekosala

,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 avatar Oct 15 '20 21:10 exotexot

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

exotexot avatar Oct 15 '20 21:10 exotexot

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 image

but still getting image image

mudaligekosala avatar Oct 15 '20 22:10 mudaligekosala

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: solutionex

exotexot avatar Oct 15 '20 22:10 exotexot

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

mudaligekosala avatar Oct 15 '20 22:10 mudaligekosala

I am getting error buildd failed with message C:\Program Files\Microsoft Visual Studio\2022\Community\MSBuild\Microsoft\VC\v170\Microsoft.CppBuild.targets(460,5): error MSB8020: The build tools for Visual Studio 2015 (Platform Toolset = 'v140') cannot be found. To build using the v140 build tools, please install Visual Studio 2015 build tools. Alternatively, you may upgrade to the current Visual Studio tools by selecting the Project menu or right-click the solution, and then selecting "Retarget solution".`

But i have installed 2015 Build Tools

image

chzappsinc avatar Aug 27 '22 21:08 chzappsinc

@avmoroz @vmoroz @exotexot @chrisglein Any solutions for above error?

Without re target manually?

Already downloaded 140 2015 tool kit

chzappsinc avatar Aug 28 '22 10:08 chzappsinc

Which project is failing to build? Your error message is incomplete. Also, you should start a new issue post about your issue.

https://github.com/microsoft/react-native-windows/issues

namrog84 avatar Aug 28 '22 16:08 namrog84

@namrog84

Screenshot 2022-08-28 024856

I am using https://github.com/avmoroz/react-native-fs.git#dev folk for react-native-fs

chzappsinc avatar Aug 28 '22 19:08 chzappsinc

If you open up the RNFS.vcxproj, you will the following these lines

https://github.com/avmoroz/react-native-fs/blob/dev/windows/RNFS/RNFS.vcxproj#L60

    <PlatformToolset>v140</PlatformToolset>
    <PlatformToolset Condition="'$(VisualStudioVersion)' == '15.0'">v141</PlatformToolset>
    <PlatformToolset Condition="'$(VisualStudioVersion)' == '16.0'">v142</PlatformToolset>

You are using VS2022 which is version 17 so it's falling back to v140. (because it's not finding appropriate conditional). That branch was made in 2020, long before VS2022 was officially released so it's slightly dated.

Add the following line after the above

<PlatformToolset Condition="'$(VisualStudioVersion)' == '17.0'">v143</PlatformToolset> Or just set the default fallback to v143 (line 60)

Then it should use the VS2022 build tools (v143) and then you don't have to worry about those old 2015 build tools anymore which probably aren't going to work.

namrog84 avatar Aug 28 '22 19:08 namrog84

I'm getting the following error while calling downloadFile with avmoroz/react-native-fs. Anyone encountered it or can offer some advice? I also tried wwimmo/react-native-fs with no luck.

RNFS.dll!winrt::impl::consume_Windows_Foundation_IPropertyValue<winrt::Windows::Foundation::IReference<unsigned __int64>>::Type() Line 190	C++
RNFS.dll!RNFSManager::ProcessDownloadRequestAsync$_ResumeCoro$1() Line 954	C++
[External Code]	
RNFS.dll!winrt::impl::resume_apartment(const winrt::impl::resume_apartment_context & context, std::experimental::coroutine_handle<void> handle) Line 8289	C++
RNFS.dll!winrt::impl::disconnect_aware_handler::Complete() Line 3148	C++
RNFS.dll!winrt::impl::disconnect_aware_handler::operator()() Line 3139	C++
RNFS.dll!<lambda_7b3a35664967a00a906a66b76e011559>::operator()<winrt::Windows::Foundation::IAsyncOperationWithProgress<winrt::Windows::Web::Http::HttpResponseMessage,winrt::Windows::Web::Http::HttpProgress> const &,enum winrt::Windows::Foundation::AsyncStatus>(const winrt::Windows::Foundation::IAsyncOperationWithProgress<winrt::Windows::Web::Http::HttpResponseMessage,winrt::Windows::Web::Http::HttpProgress> & __formal, winrt::Windows::Foundation::AsyncStatus operation_status) Line 3168	C++
RNFS.dll!winrt::impl::delegate<winrt::Windows::Foundation::AsyncOperationWithProgressCompletedHandler<winrt::Windows::Web::Http::HttpResponseMessage,winrt::Windows::Web::Http::HttpProgress>,<lambda_7b3a35664967a00a906a66b76e011559>>::Invoke(void * asyncInfo, int asyncStatus) Line 860	C++
[External Code]
Screenshot 2022-09-05 at 17 53 50
    const download = await FileSystem.downloadFile({
      fromUrl,
      toFile: destinationPath,
      headers: {
        Authorization: `Bearer ${Config.API_KEY}`,
      },
    });

cjhines avatar Sep 05 '22 15:09 cjhines

Youre calling the wrong class. It needs to be RNFS.downloadFile(...)

exotexot avatar Sep 05 '22 16:09 exotexot

It's just an import variable.

import FileSystem from 'react-native-fs';

"RNFS" doesn't work either sadly.

FileSystem.DocumentDirectoryPath also works okay.

cjhines avatar Sep 06 '22 06:09 cjhines

Hi @exotexot 👋 Nice to stumble upon a familiar face here 😃 I wonder, do you know what happened here, and why Windows is not yet supported in react-native-fs out of the box? At the first glance on this thread, it seems the working implementation for Windows was ready more than two years ago, and even if it has some deficiencies, it sure works better than the original react-native-fs, which just crashes an app straight away if imported. Why was not it merged into react-native-fs, is that lib also abandoned by maintainers and thus merits to be forked / hijacked? 🏴‍☠️

birdofpreyru avatar Feb 07 '23 15:02 birdofpreyru

@birdofpreyru yes, the original repo is pretty much unmaintained....

exotexot avatar Mar 24 '23 18:03 exotexot