How can we cache Svg's using SvgUri in react-native-svg? - react-native

I'm using SvgUri component from the react-native-svg package. Is there any way to cache these SVG's?
I found this issue on github, but the mentioned solution there didn't work for me.

Related

React Native Expo shows Async Storage warning

i'm using React Native expo, and it shows
[Warning: Async Storage has been extracted from react-native core and will be removed in a future release. It can now be installed and imported from '#react-native-community/async-storage' instead of 'react-native'. See https://github.com/react-native-community/react-native-async-storage].
i read this link and I understood that it's due to the fact that some dependencies are using old AsyncStorage, not the new one from community.
But I hardly found that any solution for Expo users. Is there any solution for Expo? Or if I have to manual change dependencies using the old AsyncStorage, how can i do it? Since I'm new to React Native, not really sure what to do..
In Expo you should always link the libraries that Expo includes in the App. So like mentioned in the docs here https://docs.expo.dev/versions/latest/sdk/async-storage/
expo install #react-native-async-storage/async-storage
is the correct import. If you are working with an old Expo-SDK this might be different, otherwise you should adapt your imports.
Now expo has migrated to use as well the community version as you can see here.
But if you get this warning definitely you have some dependency or more that still use the react-native-core version, if so please refer to the first answer to How to resolve using AsyncStorage (deprecated) warning? Using the community (correct) library:
if this is the case the best is as suggested in that answer is to
Your best course of action is to fork the repo and fix all instances of AsyncStorage to use the correct version, or open an issue.
This error occurs because firebase imports AsyncStorage from react native core and not the new library #react-native-async-storage/async-storage. I think firebase hasn't updated the by default import yet so you have to do it yourself.The way I fixed it was ;
Install react-native-async-storage: npm i #react-native-async-storage/async-storage
Go into the firebase index.js file that imports AsyncStorage from react native core: It is located at : 'node_modules/#firebase/auth/dist/rn'.
Create a variable that imports AsycnStorage from 'node-modules/#react-native-async-storage/async-storage' :
var AsyncStorage = require('../../../../#react-native-async-storage/async-storage');
Replace all uses of AsyncStorage in this file from react native core with new variable, i.e. replace "ReactNative__namespace.AsyncStorage" with "AsycnStorage",

What package does create-react-app docs use

I am wondering how I can create a docs site like create-react-app or react typescript cheatsheets. I am imaging they are using the same package or setup, I just want to know what they are using. Apologies if the answer is too obvious!
After some investigation I discovered they are using docusaurus.

VsCode Intellisense react native not working

I am facing the problem. I am not getting intellisense of properties onPress onLongPress, paddingHorizontal, paddingVertial even in import when I type Touch then expected Suggestion will be Touchable, TouchableOpacity etc no any suggestion working in react native in vscode.
If anyone still look for a solution,
here, install this npm package #types/react-native by typing in terminal:
npm install --save #types/react-native
This is where I found the solution
So i found an easy solution to this. All you have to do is change your language mode from JavaScript to JavaScript React.
But that only fixes the auto complete issue, to also fix the auto import you can install this vs code extension called npm Intellisense by Christian Kohler.
Link: https://marketplace.visualstudio.com/items?itemName=christian-kohler.npm-intellisense
You will need to install an extension in VsCode to get that functionality.
vscode-react-native
To install and use the extension, just follow the steps provided from that github repository.
Happy coding!

Error when using component npm?

I'm trying to use an npm library in my react-native app. but I have this error
I'm using cielo library
and I'm importing to my project
import cielo from 'cielo';
Can someone help me?
Look at github source code of this package here.
It seems you have to pass some parameter when importing this package. You can take a look at usage example of this package here. Your import code seems to be wrong...

How to determine if npm package is compatible with react-native?

Is there a way to determine if a npm package is compatible with react-native ?
I read that to be usable in react-native they must have polyfill. Is this something I can look for?
For example:
https://www.npmjs.com/package/redux-persist
I am learning react-native and javascript. I was hoping to take advantage of the many existing npm packages. However unless the package has "react-native" as part of the package name it does not seem to work.
Thanks in advance,
UPDATE (8/7/2017): Have a look at Andre Staltz's (staltz/react-native-node) package which makes ALL node packages work with react native!
As I understand it, any package that is (( NOT )) DOM dependent, should work. With regard to the rt2zz/redux-persist package, I only quickly looked it over but it appears as though they support the react-native store since they provide instructions for it.
import {AsyncStorage} from 'react-native'
persistStore(store, {storage: AsyncStorage})