Updated 'react-native-scrollable-tab-view' react native library - reactjs

So I'm currently making an app right now based out of react native and I'm trying to use the 'react-native-scrollable-tab-view' (https://www.npmjs.com/package/react-native-scrollable-tab-view) RN library. It had been working previously but when I upgraded my react from 16 to 18, the ViewPropTypes (that the library was using) has been deprecated. Now, I could just downgrade my react but I was wondering if there's any other way that could somehow help me with this?
Thanks!

Try to import ViewPropsTypes from deprecated-react-native-prop-types.

Related

How to load the react library built using webpack to dynamically in a react application which is using react-scripts

All,
I have an issue while doing Dynamic import of React Library (Built using webpack) in to React Application (Built using react-scripts). I was unable to import the component with normal import statements. I have tried to add the Library instance to window object and use it in react application which is working fine, but limited to Class based Components. If I try to use Functional Components, it says
`Invalid Hook Call Warning
You are probably here because you got the following error message:
Hooks can only be called inside the body of a function component.
There are three common reasons you might be seeing it:
You might have mismatching versions of React and React DOM.
You might be breaking the Rules of Hooks.
You might have more than one copy of React in the same app.`
Can anyone help on resolving my issue?

REACTJS.NET SSR - Object doesn't support property or method 'forwardRef'

I am trying to render my REACT components via SSR with REACTJS.NET in ASP.NET project.
In the JS file for SSR, I'm importing SimpleBar component from simplebar-react package.
This is causing the error TypeError: Object doesn't support property or method 'forwardRef'.
I currently have 2 JS files, one for server and one for client. In the JS for server I am removing the adding of event listeners and similar. However, I can't get away from importing at least the npm package in both JS files.
Any idea on how I can avoid such error?
I am using Webpack + REACTJS.NET version 3.2.0.
So, after trying a lot of things, this is the best solution I came across.
Before I begin, I am aware that conditional imports is being introduced in ECMA but it isn't working for me, or at least, they way I have the project setup.
Basically, my solution is resolved by mixing ES6 with CommonJS and with help of Webpack and babel.
In Webpack I am creating a plugin:
And in code, when I want to import the Simplebar react component, I do the following in the constructor:
And then, whenever I want to use my imported component, I do the following:
This was the best way I found in order to render with SSR. I think it's okay since the content between server and client side are the same.
Does anyone know a better solution? Or do you have concerns?

Are React, ReactJS and React.js different names for the same thing?

Are React, ReactJS and React.js different names for the same thing?
If they are different, what are the differences?
React = react = react.js = reactjs = ...
They all refer to the same JS library.
As Mentioned in their website:
React is a JavaScript library for building user interfaces
From what I know, .js and JS suffixes are a common thing in JavaScript world. Since React is a general world, sometimes they call it ReactJS to show it's a JS library.
Other examples are Next.js, Editor.js, Express.js, Node.js and so on...
Also you can see the website is reactjs.org, but it's called React in the page.
React is a utility package for UI implementation build by javascript.
So the base name is "react", but you can express its language more specifically by attaching js to it and make it bound to the web.
Also, it makes it distinguishable from other libraries called ReactNative.
There is no package such as react.js or ReactJs on npm and the main package is the "react" itself.
These named you've mentioned, might be for the focus on the core name itself, preventing collision from other packages with react itself
There is reactphph but the react keyword is using as a reference to this react not react in any other language or something.

Can't resolve 'react/jsx-dev-runtime' After updating React 16.13.1 -> 17.0.2

So I need to update react, react-dom in order to update nextjs version to 11. React docs says that the new jsx transform approach is backwards compatible, though I met such problem after updating to react 17.0.2. Any file using jsx fails to compile with Can't resolve 'react/jsx-dev-runtime', no matter if I leave the import React from 'react', or remove it as intended after updating to react ^17.
I tried updating #babel/preset-react, using latest #babel/plugin-transform-react-jsx, same problem. The only thing I've found in a similar question topic here is adding /** #jsxRuntime classic */ to the top of the file, which obviously doesnt solve the problem for the whole application (perhaps there might be a way to make such directive global but even then - I would like to be able to use the new and more optimised jsx compiling)
Haven't been able to google exactly my case and any existing suggestions for similar cases didn't help.
To summarise - I need to either make my app work without importing react itself (https://reactjs.org/blog/2020/09/22/introducing-the-new-jsx-transform.html) or at least to be able to use the old way of jsx compiling with this new react version.
Any thoughts?

Are there differences between ReactJS v0.13.3 and v0.14.0?

Started to look at ReactJS and noticed that the latest version of ReactTS (typescript) 0.13.3, and the ReactJS version 0.14.0.
Question - are there any differences between versions 0.13.3 and 0.14.0?
Is it possible to join without restrictions ReactJS V0.14.0 + ReactTS V0.13.3?
There are a big changes in 0.14. Main change is splitting code base into two packages: main react part and react dom library, so looks like it's impossible to make these different versions working together.
You can read all changes here

Resources