I have just got preact-redux-example up and running, and now I am attempting to use Preact Dev Tools in my app.
Based on this post I assumed it was a case of adding
import 'preact/devtools'
into the entry point (app.js) file.
However, this yields the following error:
./src/components/app.js
Module not found: Error: Cannot resolve module 'preact/devtools'
Is there something else I need to install, or am I on the wrong track?
preact/devtools has landed in version 6.4.0, but the example project uses version 4.8.0. So you need to upgrade the preact version to be able to import it:
npm install --save preact#latest
Or if you're using yarn you can run:
yarn upgrade preact
Related
So I am attempting to make a web app with React, Firebase, and the react-firebase-hooks module and I can't even get my code to compile. I have uninstalled react-firebase-hooks at least 3 times now and re-installed it just the same. I even installed it globally.
My output from npm list is:
Firebase resolves fine and there are no issues, so it can't be that something isn't installed. In my code, I am using:
import {useAuthState} from 'react-firebase-hooks';
import {useCollectionData} from 'react-firebase-hooks/firestore';
To import useAuthState and useCollectionData from react-firebase-hooks.
Has anyone else had any issues with this? Is this some sort of compatibility issue that I'm not noticing? I also created a totally separate project running
npx create-react-app test
and then
cd test
followed by
npm install --save react-firebase-hooks
, imported the same 2 components from that module, ran my code with
npm start
and got the same error as I did in my actual app.
I also used
rm -rf node_modules
and then ran
npm install
to no avail.
I am fairly new to the web dev world as well as React and Firebase so please forgive me if I'm overlooking something here.
The useAuthState comes from "react-firebase-hooks/auth" modeule, that's why it's not working
I want to use the Ionicons as this (import {Ionicons} from '#expo/vector-icons';) in my app, but after running it gives the error that (Error: Unable to resolve module #expo/vector-icons from C:\ReactNewProject\App.js: #expo/vector-icons could not be found within the project.)
please help.
First of all, when you're installing the Expo into your React project, be careful to install the Expo libraries for the exact same Expo version you've installed. Install all the Expo libraries as it says in that version's documentation.
For instance for Expo v.4, you can you use the following documentation.
https://reactnavigation.org/docs/4.x/getting-started
And this code (expo install react-navigation react-native-gesture-handler react-native-reanimated react-native-screens) to install all the Expo v.4 libraries, and it will work completely fine.
when I'm trying to install some package
like:
react-native-floating-action
or:
react-native-action-button
I'm running the
npm i react-native-floating-action --save
and when I run react-native link
i get this error:
PS C:\Projects\projectname> react-native link
rnpm-install info Linking assets to ios project
rnpm-install ERR! Something went wrong while linking. Error: Cannot read property 'pbxprojPath' of null
Please file an issue here: https://github.com/facebook/react-native/issues
Cannot read property 'pbxprojPath' of null
TypeError: Cannot read property 'pbxprojPath' of null
at Object.linkAssetsIOS [as copyAssets] (C:\Projects\projectname\node_modules\react-native\local-cli\link\ios\copyAssets.js:24:41)
at C:\Projects\projectname\node_modules\react-native\local-cli\link\link.js:104:12
at Array.forEach (<anonymous>)
at linkAssets (C:\Projects\projectname\node_modules\react-native\local-cli\link\link.js:94:28)
at C:\Projects\projectname\node_modules\react-native\local-cli\link\link.js:171:30
these are my versions:
react-native-cli: 2.0.1
react-native: 0.57.1
npm --version
6.4.1
expo --version
2.6.14
Expo does not support linked binaries. If you require linked binaries, you must first Eject from Expo to ExpoKit or initialize your project using react-native init MyProjName
Reference
If you know that you'll eventually need to include your own native code, Expo is still a good way to get started. In that case you'll just need to "eject" eventually to create your own native builds. If you do eject, the "Building Projects with Native Code" instructions will be required to continue working on your project.
https://facebook.github.io/react-native/docs/getting-started.html
This worked for me:
npm update
react-native link
Eventually, I found the problem,
I needed to run react-native upgrade, and had a different version of react-native in the package.json from the node_modules
writing ^0.57.8 (current react-native version) on the packge.json:
"react-native": "^0.57.8",
running npm install
setting a name for the project in the package.json:
"name":"somename"
and running
react-native upgrade
react-native link
everything was ok
seems to me that it's always a matter of versions with react-native errors
I have installed Jest v17.0.3 in my react project.
When I run jest locally it works fine, but on the build server it fails with:
Error: Cannot find module 'react/lib/ReactComponentTreeHook' from 'ReactDebugTool.js'
Both machines are running node version 6.9.1 and npm version 4.0.2.
use same version of react and react-dom. My problem fixed after using this command
npm install --save react#15.4.0 react-dom#15.4.0
this problem specially occurs on react 15.4.0 above.
Can you check which version of React you are using? Is it the same on both servers? I would try removing node_modules and reinstalling the dependencies. The reason I am suggesting this is that in React v15.4.0 you cannot import private apis and it seems that ReactDebugTools.js is trying to import from react/lib/....
From the blogpost about React v15.4.0 (Link):
However, there is a possibility that you imported private APIs from react/lib/*, or that a package you rely on might use them. We would like to remind you that this was never supported, and that your apps should not rely on internal APIs. The React internals will keep changing as we work to make React better.
Hope this helps!
In the latest versions of react we often see this error as we have loaded 2 versions of react:
To make sure you have just 1 version, run the following in your terminal:
npm ls react-dom
npm ls react
Both the react and react-dom versions need to be same.
If any one of these returns more than 1 version then that's not supported. You have to then correct it in your corresponding package.json
I had the same issue and i removed the node_modules and ran npm install and it fixed the problem.
I'm getting this error with in all my files:
Module not found: Error: Cannot resolve module 'react/lib/ReactMount' in...
I'm using the latest version of react: 15.4.0.
webpack: 1.12.11
Any help?
One quick solution to this will be use npm to install reactjs.
npm install --save react react-dom
Don't use standalone react bundle.
More solutions can be provided if you post your webpack config file.
The problems seems to be located in react-hot-loader library.
As mentioned #gaereon in my react gitub post, apps should not rely on internal APIs. So, react-hot-loader is using ReactMount.
I asked to fix it, for now I will return to latest version of React.
UPDATE
I had the 1x version. I switched to 3x beta version and works fine.