Issue installing react-reveal - reactjs

I am new to react and I am even newer to typescript. I am working on this project right now and I need to use this specific git repository which is a typescript project. I want to add react-reveal so I can have some cool animations on my website but I get this error message.
I am not sure why this specific library is not working because I have installed other librarys like reactstrap. If anyone could give me any information on how to get this to work or why this isn't working it would be much appreciated!

React-reveal doesn't seem to be actively maintained as it was last updated on August 2018.
Based on the error you received it looks that there is a library that is explicitly configured to only work with React v15 or v16. You could use a slightly older version of React that works with react-reveal. You're using React 17.0.2. You could try using React v16.14.0.
You could also follow the instructions in the error message - using the force option. Here is a link(npm: When to use `--force` and `--legacy-peer-deps`) that describes how that works.
A better way to go is search for a more popular actively maintained alternative like react-spring(https://react-spring.io/) or react-awesome-reveal(https://www.npmjs.com/package/react-awesome-reveal).

I found the problem, you must put this command in the terminal => npm config set legacy-peer-deps true

Related

Using ThreeJS with React v16

I am trying to render 3D files in my react project. I am using ThreeJS for my react project of version 16.13.1. After installing #react-three/fiber & #react-three/drei these packages, I am getting error of Module not found: Can't resolve 'react-dom/client'. After searching solution for this I get to know that for these we have to upgrade React version to 17 or above. I did it in demo project & it worked. But the restriction is that I can not update actual project version from 16 to 18 as it will change or break so many things as well as I have to take care of other dependencies. Is there any solution available for using ThreeJS with React v16.
Or if there is any other way or different packages available to render 3D files (like .glb, .gltf) please share with me.
Thank you in advance.
How to find a version of a library that supports particular version of react?
Google <library-name> npm
Go to npm page
Go to repository (usually github)
Open package.json
Check version of react; if it's matching your version go to 7.
Change tag to some previous version; go to 5.
#react-three/fiber & #react-three/drei for react 16.13.1
These two should work:
#react-three/fiber 4.2.21
#react-three/drei 3.2.0
npm install #react-three/fiber#4.2.21 #react-three/drei#3.2.0
Disclaimer
You can never know if the packages work without trying. Many things changes and bug fixes only apply to the newest versions.
I found one package react-3d-viewer to render 3D files which perfectly work for me.
Google model viewer also works and it comes with variety of props which is good for customization of rendered 3D model.
https://github.com/dwqdaiwenqi/react-3d-viewer
https://modelviewer.dev/docs/index.html

microsoft fluent UI library doesn't work with react 18

microsoft fluent-UI/react library did not work on my project when I included it, what is the best way to make this work properly? the UI broke immediately after I ran the project and I would like to know what the best fix is to this problem
There is no proper fix for this yet. And it looks like dev team is not considering this issue as high priority. Check out this github issue.
Pls use following command and following library Fluent UI - React Northstar able to work with react v18
npm i #fluentui/react-northstar --legacy-peer-deps

Unable to Add React to existing Rails app

I've setup a rails app all good, server runs fine etc, now I need to add React to it.
I see the command
rails webpack:install:react
appears to be the way everyone recommends but when I run this I get the following error:
rails aborted!
Don't know how to build task 'webpacker:install:react' (See the list of available
tasks with `rails --tasks`)
Did you mean? webpacker:install
So I run webpacker:install, alls good then try with :react again and the same errors generated, I've got react added in the package.json file and react-rails in the gem file. I've also run bundled since adding these.
I cant find an answer anywhere so whatever you've got I'll take.
Thank you.
Found the issue, the problem was that webpacker:install:react was removed from webpacker v6, moved to version 5.4.3 and the issues resolved.
More info here:
https://github.com/rails/webpacker/pull/2802/files#diff-8efe491b392a5a50e31b54660bbc0e7258e544e36d4e0b8a65e4cca93d39d18c
As the above answer states, this was removed. If you see a tutorial telling you to run rails webpack:install:react you can simply skip it if you've already run rails webpack:install. React now works "out of the box" and so you don't need to specify it.

Unable to use PushToTalkButton of Speechly in react app

I am working with Speechly API in my react application. In that, I imported PushToTalkButton and PushToTalkButtonContainer from #speechly/react-ui and I have also configured from Speechly Playground it's working fine in Playground. Then I click on the button(PushToTalkButton) in react application it is not capturing my voice and not using the microphone. I tried to find out the problem with ErrorPanel but nothing is showing.
Could you try upgrading to version 1.2.4 by issuing npm install #speechly/react-ui#latest
Earlier versions were inadvertently coupled with a certain version of react-client package and might cause a problem you described.

How to make changes to third party package in React Native 0.60+

I'm struggling with making changes and possible a pull request for a third party react native package with cocoapods and auto linking.
In this case I want to add some minor functionality to React Native Camera. And I've forked the repo.
While developing I'd like to use my local code, but I can't get it to work.
I'ven tried using npm link, but this doesn't work since React Native can't find the linked package with the TypeScript import statement.
I've also tried just to edit Objective C code directly in node_modules, running pod install again and rerunning react-native run-ios, but it doesn't seem to include my changes.
I've never really made pull requests to other packages before, so I think I need some help. I thought this would be the easiest thing to google, but it turns out it's not.
You may be doing this already, but make sure that you clean and rebuild the project from xcode if you're modifying objective C code in the node modules folder, before re running react-native run-ios.
If you've already installed the library you also shouldn't need to rerun pod install.
Similarly on android, be sure to rebuild the project in android studio.

Resources