I have a react native project that already requires and has installed redux-actions.
The app was working correctly.
I then added yarn add lodash
Afterwards I get an error
Error: ENOENT: no such file or directory, open 'node_modules/redux-actions/node_modules/lodash/identity.js'
Did yarn add remove the lodash somehow from redux-actions/node_modules?
How do I correct this error?
Now that I did an npm list I see that there is a lodash 3.10.1 installed and that redux-actions requires lodash#4.17.4. Did yarn install that lodash based on a requirement of another module and hoiseted it into the root of node_modules? How do I know which module caused that - I'd like to upgrade it to the latest lodash and want to make sure that doesn't break any dependencies.
Related
I am using https://reactnative.dev/docs/environment-setup 0.64
I npm install #walletconnect/client
put below import in App.js
import WalletConnect from "#walletconnect/client";
after npx react-native run-ios and got below error:
error: Error: While trying to resolve module `crypto` from file `/Users/hahaha/workspace/mobile/reactnative/nonft/node_modules/#pedrouid/iso-crypto/dist/cjs/helpers/env/node.js`, the package `/Users/hahaha/workspace/mobile/reactnative/nonft/node_modules/crypto/package.json` was successfully found. However, this package itself specifies a `main` module field that could not be resolved (`/Users/hahaha/workspace/mobile/reactnative/nonft/node_modules/crypto/index.js`. Indeed, none of these files exist:
I tried to remove node_modules folder and npm install again but still get the same error.
I am sure that it is thrown by #walletconnect/client because when I removed
import WalletConnect from "#walletconnect/client";
then the error gone
crypto is a built in Node module, which isn't available in React Native, as iOS/Android apps don't run with a Node runtime - only web apps do.
There are a few ways to solve this problem, all of them fairly hacky.
One way is to replace the crypto module with a React Native native module that does the same thing. React-native-crypto is the package used by create-react-native-dapp (https://www.npmjs.com/package/create-react-native-dapp) to integrate with WalletConnect: https://www.npmjs.com/package/react-native-crypto
To get this integration working, note that you'll need to be able to link modules and run rn-nodeify, as it mentions in the instructions on that npm package:
npm i --save react-native-crypto
# install peer deps
npm i --save react-native-randombytes
react-native link react-native-randombytes
# install latest rn-nodeify
npm i --save-dev tradle/rn-nodeify
# install node core shims and recursively hack package.json files
# in ./node_modules to add/update the "browser"/"react-native" field with relevant mappings
./node_modules/.bin/rn-nodeify --hack --install
If you're using Expo, note that you'll need to eject Expo before this can work.
Another hacky workaround is to run WalletConnect in a WebView using react-native-webview. There's an old but working example of this that you can just use to plug and play WalletConnect without requiring linking that you can get here: https://github.com/cawfree/react-native-walletconnect
Note that that repo is archived and effectively hardcoded to WalletConnect version 1.0.0, but it's a pretty simple codebase - you can just effectively copy and paste its code and update it to the latest version of WalletConnect to get it working with a later version if desired.
As a final note, there are multiple ways to get node modules running in React Native on top of rn-nodeify. If you'd like to explore other methods of getting node modules running, here's a quick rundown of other possibilities: https://gist.github.com/parshap/e3063d9bf6058041b34b26b7166fd6bd
I have recently integrated react-native-web into my native project and have included webpack. I've followed all the instructions listed here.
However, when trying to run using the webpack command listed on the bottom of that page, i keep getting the error:
ERROR in ./index.web.js
Module build failed (from ./node_modules/babel-loader/lib/index.js):
Error: Cannot find module 'babel-preset-react-native' from '<*path to root*>'
I have the preset metro-react-native-preset already installed and my babel config looks like the following:
babel.config.js
module.exports = {
presets: ['module:metro-react-native-babel-preset']
};
Im currently using React Native 0.62
Could you try to install 'babel-preset-react-native'?
npm install --save -dev babel-preset-react-native
You said you've got metro-react-native-preset already installed but your config has metro-react-native-babel-preset - I assume that mismatch is just accidental?
Anyway, that's probably unrelated. Here's a few things to try:
Have you verified you've got 0.62 of react native installed? I.e. in the npm lock file, as maybe you're on an older version (pre 0.57) which uses that older plugin.
Have you got a .babelrc file too, perhaps, with the other plugin defined instead?
Similar to (1), have you tried to delete the lock file and/or node_modules folder and run npm install again from scratch so versions match up properly.
I'm using npm link to change my private package and see changes in action in another project. The problem is that both my projects use graphql as a dependency so I get an error Cannot use GraphQLSchema "[object GraphQLSchema]" I was trying to use resolutions key in package.json of my main project. Unfortunately it didn't help. So, I'm clueless about how to resolve this issue without pushing a newer version of my package to npm
To get around this do the following
npm i -g graphql
For each dependant project, inside the working directory
npm link graphql
This will connect to the globally installed graphql for each project and allow you to share the module without the shared directory structure
So I've started a new react-native project and copied over the .babelrc file from my previous project. I've installed the necessary plugins but I'm getting the error
Unknown plugin transform-decorators-legacy specified in .babelrc, attempted to resolve relative to "/mypath/project"
I've checked the node_modules in the path and see that the plugin was installed using yarn add. I'm also getting similar errors with my eslint plugins. Am I missing something in my project setup to have babel and eslint see the node_modules?
Is it perhaps caused by installing react-native-code-push? I think it had some errors when I installed codepush where it duplicated the react pod in the pod install - and so I removed it from the podfile. Is it trying to use a cached code-push js even though I don't have code push implemented in my react js files?
trasnform-decorators-legacy
You have a typo here.
try this :
yarn add babel-plugin-transform-decorators-legacy -g
for NPM :
npm install --save babel-plugin-transform-decorators-legacy
I am trying to add the mapbox gl package to my Aurealia Typescript skeleton using jspm. I am using the following command.
jspm install npm:mapbox-gl
This is what I am getting.
Looking up npm:mapbox-gl
Updating registry cache...
Downloading npm:mapbox-gl#0.19.1
warn Error on processPackageConfig
Package.json dependency mapbox-gl-shaders set to github:mapbox/mapbox-gl-shaders#e4737bb136d718f9c5fe8d943380f05db6249b57, which is not a valid dependency format for npm.
It's advisable to publish jspm-style packages to GitHub or another registry so conventions are clear.
warn Error processing package config for npm:mapbox-gl.
err Error processing package config for npm:mapbox-gl.
warn Installation changes not saved.
I am using jspm 0.16.36.
When I try to install the package via npm install mapbox-gl it works normally. Any suggestions?
Considering you are using jspm, you might also want to try and reference it through the GitHub repo rather than through npm:
$ jspm install github:mapbox/mapbox-gl-js
It works for me with jspm v16.x and v0.21.0 of MapboxGL.