This is for a group project, those with me put up some code on github and I cloned it. Did npm install and ran it with npm start. But this error keeps on coming:
https://i.imgur.com/ZrCoWJk.png
I've tried to delete the node_modules folder and reinstall it. Tried to do npm install --save react-router-dom.
The package.json file:
...
"history": "^4.9.0",
"node-sass": "^4.11.0",
"react": "^16.8.6",
"react-bootstrap": "^1.0.0-beta.6",
"react-dom": "^16.8.5",
"react-helmet": "^5.2.0",
"react-router": "^5.0.0",
"react-router-dom": "^5.0.0",
"react-scripts": "2.1.8",
...
Since the group have already done so much I'd expect to see the progress and not this error message :(
Fixed by finding the module folder in node_modules, deleting it, adding it again with npm install --save and then it worked as it should!
Looks like that the issue is with "history". Try change it's version.
Related
It works on web, but when I try to run it on android, I get this error:
Android Bundling failed 1275ms
While trying to resolve module `hoist-non-react-statics` from file `/PROJECTPATH/node_modules/react-native-gesture-handler/src/gestureHandlerRootHOC.tsx`, the package `/PROJECTPATH/node_modules/hoist-non-react-statics/package.json` was successfully found. However, this package itself specifies a `main` module field that could not be resolved (`/PROJECTPATH/node_modules/hoist-non-react-statics/dist/hoist-non-react-statics.cjs.js`. Indeed, none of these files exist:
* /PROJECTPATH/node_modules/hoist-non-react-statics/dist/hoist-non-react-statics.cjs.js(.native|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.js|.native.js|.js|.android.jsx|.native.jsx|.jsx|.android.json|.native.json|.json)
* /home/esd/Documents/pro/bunnymoney/node_modules/hoist-non-react-statics/dist/hoist-non-react-statics.cjs.js/index(.native|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.js|.native.js|.js|.android.jsx|.native.jsx|.jsx|.android.json|.native.json|.json)
I've also cleared my metro cache (npm start --reset-cache), reinstalled all node modules (deleted node_modules folder and run 'npm install'), and cleared watchman (watchman watch-del-all) Initially, it couldn't find the module, but I installed it I don't know what to do now. Here are my project dependencies:
"#react-navigation/native": "^6.0.6",
"#react-navigation/native-stack": "^6.2.5",
"expo": "~43.0.2",
"expo-splash-screen": "~0.13.5",
"expo-status-bar": "^1.1.0",
"expo-updates": "~0.10.13",
"hoist-non-react-statics": "^3.3.2",
"react": "17.0.1",
"react-dom": "17.0.1",
"react-native": "0.64.3",
"react-native-gesture-handler": "~1.10.2",
"react-native-reanimated": "~2.2.0",
"react-native-safe-area-context": "3.3.2",
"react-native-screens": "~3.8.0",
"react-native-web": "0.17.1"
Search your project for any imports from "hoist-non-react-statics" - you will most likely find that somewhere along the line your auto import imported useEffect, useState etc from there instead of from "react" itself.
It doesn't look like you are using typescript, but there was an issue recently with a specific version that was causing this issue.
You don't need "hoist-non-react-statics", so feel free to remove it as a dependency once you are done with the above.
This is my package.json:
{
"name": "BStore",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest"
},
"dependencies": {
"expo": "^32.0.5",
"native-base": "^2.11.0",
"prop-types": "^15.7.2",
"react": "16.6.3",
"react-native": "0.58.3",
"react-native-gesture-handler": "^1.0.15",
"react-native-paper": "^2.11.0",
"react-navigation": "^3.0.9",
"react-navigation-material-bottom-tabs": "^1.0.0"
},
"devDependencies": {
"babel-core": "7.0.0-bridge.0",
"babel-jest": "24.1.0",
"jest": "24.1.0",
"metro-react-native-babel-preset": "0.51.1",
"react-test-renderer": "16.6.3"
},
"jest": {
"preset": "react-native"
}
}
I am getting this error Unable to resolve modulereact-native/Libraries/Components/View/ViewStylePropTypes`
any ideas how can I solve this issue?
Had same issue.
As I find out expo 32.0.5 and react-native 0.58.3 are not compatible. So expo react-native fork should be used.
To install it you can use command
npm install --save react-native#https://github.com/expo/react-native/archive/sdk-32.0.1.tar.gz
You have to read the error-message carefully. I've the same issue, mine was:
Unable to resolve module
react-native/Libraries/Components/View/ViewStylePropTypes from
/APP/node_modules/react-native-render-html/src/HTMLUtils.js:
Module react-native/Libraries/Components/View/ViewStylePropTypes
does not exist in the Haste module map
So the 3rd Party Library react-native-render-html cause the error, because it try to use ViewStylePropTypes.
In case of #adrian-moisa: For you it's react-native-reanimated.
Don't know what the cause was for the ThreadOpener, he didn't post an usable error-message.
Fact is, that ViewStylePropTypes was removed up from react-native 0.58
compare:
https://github.com/facebook/react-native/tree/v0.57.8/Libraries/Components/View
https://github.com/facebook/react-native/tree/v0.58.0/Libraries/Components/View
So the solution is to figure out, which 3rd-Party Component cause the error, and look if there is an upgrade from the maintainer, or yourself have to patch it (e.g. with patch-package)
This combo works for me:
"expo": "^31.0.4",
"react": "16.5.0",
"react-native": "https://github.com/expo/react-native/archive/sdk-31.0.1.tar.gz",
I adjusted the instructions from here, with what worked for me:
Here’s how to upgrade your app to Expo SDK 32.0.6 from 31.0.0:
Close your Expo CLI server In app.json, change sdkVersion to "32.0.1"
In package.json, change these dependencies:
react-native to "https://github.com/expo/react-native/archive/sdk-32.0.1.tar.gz"
expo to "^32.0.6"
react to "16.8.6" — (this exact version)
react-navigation to "^3.9.1" (if you use it — this is also optional, you don’t have to update it to use the newest SDK. If you
choose to, make sure you read the changelog for breaking changes, and
see this upgrade guide for upgrading from v2 to v3.)
jest-expo to "^32.0.0" (if you use it)
sentry-expo to "~1.11.2" (if you use it) Delete your project’s node_modules directory and run npm install again (or use Yarn, we
love Yarn) Run expo start -c Update the Expo app on your phones from
the App Store / Google Play. expo-cli will automatically update your
apps in simulators. Make sure to check the breaking changes section
of this post! If you built a standalone app previously, remember that
you will need to create a new build in order to update the SDK
version. Run expo build:iosand/or expo build:android when you are
ready to do a new build for submission to stores. If you are planning
to submit your iOS app to the App Store, you must upgrade to Xcode 10
in order to do so.
I have tried over and over and over to find a solution, but I seriously can not understand what is going on.
$ npm -v
6.5.0
$ node -v
v10.10.0
My package.json pulls in the followin dependencies:
{
"private": true,
"scripts": {
"dev": "NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
"production": "NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
"tests": "phpunit --testdox"
},
"devDependencies": {
"laravel-mix": "^3.0.0",
"lodash": "^4.17.11",
"purifycss-webpack": "^0.7.0",
"tailwindcss": "^0.7.2",
"webpack": "^3.12.0"
},
"dependencies": {
"#bugsnag/js": "^5.1.0",
"#bugsnag/plugin-vue": "^5.1.0",
"axios": "^0.17.1",
"babel-preset-es2015": "^6.24.1",
"blueimp-md5": "^2.10.0",
"clientjs": "^0.1.11",
"css-loader": "^0.28.11",
"dotenv": "^6.2.0",
"glob-all": "^3.1.0",
"js-cookie": "^2.2.0",
"laravel-echo": "^1.4.1",
"libphonenumber-js": "^1.6.9",
"md5": "^2.2.1",
"moment": "^2.22.2",
"postcss-import": "^11.1.0",
"purgecss-webpack-plugin": "^1.4.0",
"purify-css": "^1.2.6",
"pusher-js": "^4.3.1",
"qs": "^6.6.0",
"vee-validate": "^2.1.3",
"vue": "^2.5.17",
"vue-i18n": "^8.3.2",
"vue-router": "^2.8.1",
"vue-wysiwyg": "^1.7.2",
"vuex": "^3.0.1"
}
}
I can do an npm run dev 'x' times without any issue, when all of a sudden, without ever having ran another npm command, or pulled in new dependencies, or whatever, it can all of a sudden complain about a missing modules.
Module build failed: Error: Cannot find module 'es-to-primitive/es6'
This is just an example; it has been other modules as well.
My solution to this is basically:
$ rm -f -R ./node_modules/*
$ npm install
$ npm run dev
This always fixes the issue. I just don't understand why. The dependency should have been installed prior because my previous builds ran just fine. I'm running on a Macbook Pro, and I seriously have no idea what might be causing this behaviour.
On my last run, I checked node_modules/es-to-primitive and there was no es6.js file, so I understand the error, but after doing the above fix, it got that file installed. I guess I just don't understand how it can 'disappear' again after a while...
Anything I'm doing wrong or don't understand properly?
Thanks!
I hope I am not too late, but I had the exact same problem and it was driving me absolutely insane. I had to delete the node_modules directory and reinstall everything up to several times a day, and nothing I did made any difference. It then crossed my mind that iCloud Drive syncing may be causing the problem, as I had my project directory saved in ~/Documents. I tried to delete the directory from iCloud Drive and let it completely sync, and it made it somewhat better but there still were issues with some of the modules. I asked myself, there must be a way to exclude a directory from syncing? And yes, it is!
Apparently, adding .nosync to the name of a file or directory will exclude it from syncing to iCloud Drive. Earlier you could add a blank file named .nosync to any directory to exclude it, but it seems this no longer works, at least not for me on macOS 10.15.2.
With that said, I am very happy to share that renaming the node_modules directory to node_modules.nosync, and adding a link to the new directory to keep npm from complaining, seems to have solved the issue:
$ mv node_modules node_modules.nosync/ && ln -s node_modules.nosync node_modules
After doing this, I have not had to delete and reinstall the modules even once! Everything just works, just as it should.
I downloaded a react-native application from a git repository. Inside it, there is a file called package.json that looks like this:
"dependencies": {
"expo": "^27.0.0",
"invariant": "^2.2.4",
"react": "16.3.1",
"react-native": "^0.55.0",
"react-native-iphone-x-helper": "^1.0.2",
"react-navigation": "link:../..",
"react-navigation-header-buttons": "^0.0.4",
"react-navigation-material-bottom-tabs": "0.1.3",
"react-navigation-tabs": "^0.5.1"
}
Do I need to use npm to install all these libraries or will the app download them automatically?
Thanks!
Yes, you need to npm install in the terminal, from the project root directory, to download and install the dependencies, as #gaback suggested in a comment.
Alternatively, if you prefer using yarn, you can yarn install from the same directory to install the dependencies.
So far I have been unsuccessful in an attempt to use the env preset. I browsed the git issues that others have raised such as this, and implemented some of the suggestions that appeared to work for others, but no luck so far.
Here's what I'm working with:
package.json
"bundle": "browserify ./client/app.js -d -o ./public/o.js -t [ babelify --presets [ env ] ]",
"devDependencies": {
"#babel/cli": "^7.0.0-beta.40",
"#babel/preset-env": "^7.0.0-beta.40",
"babel-core": "^6.26.0",
"babelify": "^8.0.0"
...
And here is the error:
Error: Couldn't find preset "env" relative to directory "/Users/user/Documents/git/ts/client" while parsing file: /Users/user/Documents/git/ts/client/app.js
Anything I could be missing?
Many of the github issues relating to this suggest that babel-preset-env is not installed.
Indeed it doesn't seem to be there in your package.json. Add & install it by doing this:
npm install babel-preset-env --save
Though the earlier answers do provide the right solution and it works. But this should be installed as a dev dependency not as the core one. As this is needed only for development work. If you are using npm you can use:
npm install --save-dev babel-preset-env
or if you are using yarn as package manager then use:
yarn add --dev babel-preset-env
You just need to install babel-preset-env and your code will compile properly.
npm install babel-preset-env
Basically, this type of error occurs due to mismatch in versions of babel-core, babel-preset-env and babel-loader. Below are matched and tested devDependencies, which worked for me.
"devDependencies": {
"#babel/core": "^7.11.6",
"#babel/preset-env": "^7.11.5",
"babel-loader": "^8.1.0",
"html-webpack-plugin": "^4.5.0",
"install": "^0.13.0",
"npm": "^6.14.8",
"regenerator-runtime": "^0.13.7",
"webpack": "^4.44.2",
"webpack-cli": "^3.3.12",
"webpack-dev-server": "^3.11.0"
},
"dependencies": {
"babel-polyfill": "^6.26.0"
}
You can check whether .babelrc file exists in the directory above or above the directory. Just delete the file is OK