How can I install Storybook for react native? - react-native

I have a fresh Expo project and I would like to add Storybook for all the components, the documentation seems deprecated, does anyone know how to install the latest version?

I have just tried the docs and I got Storybook on my Expo project (no longer available).
Answering your question, the package is not deprecated because, I quote,
This community translation has not been updated to the latest version of Storybook yet.
For future reference, during the installation process I faced the following "freeze" using Git Bash, if you get the same just ctrl + c to resume your terminal.

Related

How to change version of react typescript typings that expo (react native) requires?

Regarding react-native + expo, I would like to use latest #type/react in order to resolve typing issues (i.e. 'MaterialIcons' cannot be used as a JSX component), but expo start always require I install the typescript libraries and then proceeds to insist they be an older version (17.0.21). Why? How can I either ignore this behaviour (btw. answering with 'n' ends the startup and directs to either install the typescript requirements or clean the config of typescript refs -- ok expo thanks for nothing!)
The problem that I was resolving with #types/react is detailed here: 'Stack.Navigator' cannot be used as a JSX component
update to "#types/react": "~18.0.12" ( fix for eslint )
but you cant run project
Bumped into this and after some research I found this github comment from the expo repo. Which made think about this resolutions fix.
In my yarn.lock I have two versions 17.0.21 and 17.0.47, and in my package.json I point to 17.0.21
resolutions": {
"#types/react": "~17.0.21"
},
Ran yarn once again
Opened the VSCode Command Palette -> Typescript:
Reload project
No problems with eslint and was able to run the project.

is expo the windows version of CocoaPods?

Okay so what brings this up is the different installation procedures you have to do when installing dependencies in react native. Where I am confused most is making sure the installation is successful and all the file modification/linking went well.
I constantly see some dependencies telling me to do things in xcode while others require something of expo or a npx install. I guess this is a little late to be asking considering I have already installed so many things into my project but if I am using expo on a windows machine, can I ignore anything that I see using npx? I understand modifications requirede in expo need to be done but for an example like this
Is the npm install command enough? To run on IOS that is.
I‘m not sure I understood the question but I think what you are asking is if expo install replaces all npx install commands.
In that case, yes and no. Expo manages a lot in the installation process of dependencies, even some that require some native code. But just not all of them. Not all native modules can be installed by Expo (Even though there‘s a ton of them already)
But if you somehow need to install a native module, that is not yet covered by Expo, you can look into EAS, which allows native installations in an expo project.
Here‘s a link to their documentation: https://docs.expo.dev/build/introduction/

Problem with new upgraded version(0.60) of react native when we linking any third party module

In my cases when i link third party module in react native like..
npm install react-native-vector-icons --save.
react-native link
It gives message for me....
React Native CLI uses autolinking for native dependencies, but the following modules are linked manually:-
react-native-vector-icons (to unlink run: "react-native unlink react-native-vector-icons")
but if i am not link the module it will not work for me
this problem occurs only in react-native new upgraded version(0.60) not for older version.
please suggest me any solution for the given problem.
Always make sure to install any third party library manually rather than doing react-native link.
Follow the detailed manual installation https://github.com/oblador/react-native-vector-icons from here.
Firstly run this command react-native unlink react-native-vector-icons
After unlink is successful, follow the manual installation steps.
Also it's better to use yarn (https://yarnpkg.com/en/) over npm while installing a package.
Hope this helps!
Since react native 0.60 auto-linking is avaliable so that means that future libraries release won't need to run the "link" command. If you're using vector-icons you'll need to wait until the upgrade. You can use the vector icons linked to you project normally, but be careful because that will not be compatible in the next major release in react native. I also tried to upgrade to react native 0.60.3, but this is not the great idea if your using a lot of dependencies.

cannot create iOS folder on my react native app

I am asking this question for the third time and I don't get it why no one even tries to help on this, is this question not well explained? If you can ask for more information I can give!
I am having trouble created iOS folder inside my react native app(detached) as when I created the app I created it from windows machine and iOS folder didn't come when I wrote: exp detach
Now that I have got a macOS, how can I get to create iOS folder so I can use that to build from xCode. I tried react-native upgrade, this is telling me that I have some version conflicts, so I don't want to upgrade it actually, I just want to have iOS folder on my react native.
What would be the best solution in here?
Interestingly I tried exp detach over my detached app and it created iOS, it's working! hopefully this will help anyone!
Please follow the below steps:
Step I: Ensure below installable are installed
Java Sdk Android Studio
Xcode (in case of OSX)
HomeBrew (in case of OSX to install node)
Node/NPM (Node runs Javascript outside the browser. NPM is used for installing and managing Dependencies. Node and NPM come
together)
Those are some essential installs that you will need in your Project
**Step II: **
For windows/OSX you need to run the following commands in your command prompt/command line:
This is the important part for running a react native project:
**Step II: **
npm install -g react-native-cli
Then you can use this cli to start a new project like this:
**Step III: **
react-native init
Hope this helped you, please vote..

Which is the correct method of upgrading React Native in your app?

In React Native, what is the difference between:
react-native-git-upgrade
react-native upgrade
yarn upgrade react-native
Just deleting node_modules, bumping the version number in package.json, removing yarn.lock or package-lock.json and doing an npm install or yarn install
What is the preferred method, advantages/disadvantages? Are some outdated? Only relevant for certain versions?
I want to love React Native, but when it comes to versions, it is absolute hell. 0.44.1 is the only version that has consistently worked for me without random fatal errors on startup.
As you can see in here in the official react-native document, the best way for upgrading react-native is using react-native-git-upgrade if you create your project with react-native init. If you started you app with create-react-native-app please read here.
Because React Native projects built with native code are essentially made up of an Android project, an iOS project, and a JavaScript project, upgrading can be rather tricky.
Advantage: The module react-native-git-upgrade provides a one-step operation to upgrade the source files with a minimum of conflicts. Under the hood, it consists in 2 phases:
First, it computes a Git patch between both old and new template
files,
Then, the patch is applied on the user's sources.