getting an error when installing chakra ui on react js - reactjs

I installed chakra-ui in React js, and when I setup index js to place ChakraProvider I got an error on the framer motion
TypeError: framer_motion__WEBPACK_IMPORTED_MODULE_1__.motion.custom is not a function

It seems like an error, because of the frammer-motion version. Please downgrade your "framer-motion".
open package.json
change = "framer-motion": "^4.1.1", to "framer-motion": "^3.1.1",
npm/yarn install again.

Related

Reactjs - babel remove console log. Should I use webpack?

I would like to add babel-plugin-transform-remove-console on a ReactJs project to use Babel am I required to install webpack?
"react": "^18.2.0",
"react-dom": "^18.2.0"
i tried to configure babel
I get this screen instead of the classic react startup screen

Getting error while adding React Testing Library for create-react-app (version 16.12.0)

I'm working on a react project in typescript (react version 16.12.0) and I would like to add React Testing Library to this. The newer versions of react comes with React-Testing-Library but the project I'm working on doesn't come with RTL, so I installed it manually.
I added the below to package.json and did yarn install
"#types/testing-library__react": "^10.2.0",
When I did yarn start, I get this error below
Other related packages versions used
"#types/react": "~16.9.14",
"typescript": "3.4.5",
"react-scripts": "^3.0.0",
The issue was occurring with the typescript version. After some research, I found that for react-testing-library to work with typescript, the TS version needs to be updated to 3.8 and above.
After updating typescript version to 3.8 and fixing some of the errors caused by this update, I was able to resolve this error.

Module not found: Can't resolve 'react-dom/unstable-native-dependencies'

I am writing applications with React Native. I am using Expo.
My React and react-dom versions are 17.0.0 but I get an error like this on the expo web page. How can I solve the problem?
"react": "17.0.0",
"react-dom": "17.0.0",
"react-native": "https://github.com/expo/react-native/archive/sdk-38.0.2.tar.gz",
It is showing as follow:
According to your console warning, instead of
'componentWillMount'
you should give
'componentDidMount'

Facing error while installing react-redux#5.0.7

These are my current dependencies:
react": "^17.0.1",
"react-dom": "^17.0.1",
"react-popper": "^1.3.7",
"redux": "^3.7.2"
This is the error
As the document suggests:
"As of React Native 0.18, React Redux 5.x should work with React Native. If you have any issues with React Redux 5.x on React Native, run npm ls react and make sure you don’t have a duplicate React installation in your node_modules. We recommend that you use npm#3.x which is better at avoiding these kinds of issues."

__WEBPACK_IMPORTED_MODULE_4_react___default.a.memo is not a function

I just connect the app with redux and react-redux connect function, together with state and dispatches. It compiled without problems but the results are not showing. And it looks like below.
I tried to find it and found that i have to change react version.
$ sudo npm install --save react#16.4.0 react-dom#16.4.0
But it didn't work.
I am following this tutorial.
https://www.youtube.com/watch?v=BxzO2M7QcZw
you're using wrong version of React, React.memo is introduced with version 16.6.0 so, try this command to install the right version
npm install --save react#16.6.0 react-dom#16.6.0
for more info click here
This had happened to me as well. This happens when dependencies version gets updated, and the dependencies of the YouTube video you are watched has an old version.
Hence, replace the following dependencies in the package.json file:
"react": "^16.4.1",
"react-dom": "^16.4.1",
"react-redux": "^5.0.7",
"react-router-dom": "^4.3.1",
"redux": "^4.0.0",
"redux-thunk": "^2.3.0",
and run npm install.
Since the connect() function connects a React component to a Redux store,
react, redux need to be version supported. If you are willing to use newest dependencies please refer the Redux documentation.
The above method should solve your problem.
That's because #material-ui/styles has a peer dependency on react >= 16.7.0-alpha.0 and react-dom >= 16.7.0-alpha.0 that include hooks.
To use #material-ui/styles, change your react and react-dom dependencies like this:
"dependencies": {
...
"react": "^16.7.0-alpha.2",
"react-dom": "^16.7.0-alpha.2",
...
},
Find out which version of react-redux version you are using and then go to https://react-redux.js.org/versions. Click on the documentation associated with your version. You should see something like this:
Installation
React Redux 7.1 requires React 16.8.3 or later.
Update your react in package.json to the appropriate version and install.

Resources