npm Module to React Native - react-native

I’m trying to install the npm module wallet-address-validator in a React Native application. I am using expo for my development environment.
First I install wallet-address-validator
npm install wallet-address-validator
Then I run
expo start
And I get these errors
Expo Developer Tools is disconnected from Expo CLI. Use the expo start command to start the CLI again.
[14:23:00] Opening DevTools in the browser... (press shift-d to disable)
[14:23:02] Error: React native is not installed. Please run npm install in your project directory.
[14:23:02] Couldn't start project. Please fix the errors and restart the project.
[14:23:02] Set EXPO_DEBUG=true in your env to view the stack trace.
So I ran
npm install
Then I ran
expo start again
and I get this error
14:26
Recrawled this watch 1 times, most recently because: /home/dale/Desktop/Rails/TestApps/testApp: dir missing from internal state To resolve, please review the information on https://facebook.github.io/watchman/docs/troubleshooting.html#recrawl To clear this warning, run: watchman watch-del /home/dale/Desktop/Rails/TestApps/testApp ; watchman watch-project /home/dale/Desktop/Rails/TestApps/testApp

1) yarn add wallet-address-validator
2) npm install -g browserify
3) Create a file wav-in.js that imports the wallet-address-validator module and simply exports it:
var WAValidator = require('wallet-address-validator');
module.exports = WAValidator;
4) Then in the terminal in the project
browserify cwav-in.js -o wav.js
5) This will result in an error if you put in the test code below from Wallet-Address-validator in App.js
var WAValidator = require('wallet-address-validator');
var valid = WAValidator.validate('1KFzzGtDdnq5hrwxXGjwVnKzRbvf8WVxck', 'BTC');
if(valid)
console.log('This is a valid address');
else
console.log('Address INVALID');
6) You will however, get an error along the lines “… is not a function”
7) On line 3837 of wav.js change “var WAValidator = require('wallet-address-validator');” to “WAValidator = require('wallet-address-validator');”
8) On the very last line in of wav.js add “module.exports = WAValidator;”
everything should be working now
This article is also on point https://hackernoon.com/using-core-node-js-modules-in-react-native-apps-64acd4d07140

Related

Cannot reach page error when trying to open react app after running npm start in a create-react-app on cloud 9

So, I'm following an online tutorial on learning react, in the tutorial we are just creating a simple react app on cloud 9 and running the application, however, I cannot access the website after running npm start.
I used the following commands:
mkdir react
cd react
npm install -g create-react-app
create-react-app helloworld
cd helloworld
npm start
The terminal output by cloud9 says the following:
(https://i.stack.imgur.com/3sKce.png)
If I try to open http://localhost:8080 I get the following page:
(https://i.stack.imgur.com/V7Zu1.png)
Not entirely sure why this error is happening, I have deleted node modules and package-lock.json file and re done the npm install command but I'm getting the same error.

Error initialising the React Native awsomeProject via the CLI

I am trying to get the basic react native app from https://reactnative.dev/docs/environment-setup running via the CLI, but I am getting errors. I have node, python2 and jdk8 installed. I have all the Android Studio components installed as far as I can tell. I've added the environment variables.
When I run npx react-native init AwesomeProject to initialise the project, I get green ticks next to Downloading Template, Copying Template and Processing Template, but a red cross next to Installing dependencies. The error below that states Error: command failed: npm install. And further down after some warnings it states npm ERR! Unexpected end of JSON input while parsing near '...anbul":"0.4.5","mocha'
And in the initialised app folder there are no node modules.
Any idea how I get this working?
Hi the solution for this is to clear your cache :)
Please run the following command and retry:
npm cache clean --force

RN Expo issue - Something when wrong installing JavaScript dependencies. Check your npm logs. Continuing to initialize the app

I am using react native and Expo. I am unable to build new app because after I use expo init appName it shows the following error.
Heres the full message:
📦 Using npm to install packages. You can pass --yarn to use Yarn instead.
√ Downloaded and extracted project files.
× Something when wrong installing JavaScript dependencies. Check your npm logs. Continuing to initialize the app.
✅ Your project is ready!
To run your project, navigate to the directory and run one of the following npm commands.
- cd Scanner
- npm start # you can open iOS, Android, or web from here, or run them directly with the commands below.
- npm run android
- npm run ios # requires an iOS device or macOS for access to an iOS simulator
- npm run web
I tried multiple times to create a blank project, also tried npm install to install failed/not downloaded libraries and continue after failure but it showed another error:
npm ERR! code Z_BUF_ERROR
npm ERR! errno -5
npm ERR! zlib: unexpected end of file
also tried npm cache verify that showed cache is ok Content verified: 3562 (252580364 bytes).
So, How can I solve this issue?
Problems related to npm installation are very common If you do any mistake in early installation, but is avoided. Learn more about npm tree.
Steps worked for me are :
npm cache clean --force
npm cache verify
npm -g uninstall expo-cli --save
npm install expo-cli --global
expo init app-name
cd app-name
npm start
Always run as administrator if working on Windows and in root directory.
The solutions above didn't work for me but if you use 'npm install' in the directory of the app you get a clue that you shuold try 'npm install --force'
err message
You should have all these files folders and files at the start of the project otherwise not all the dependencies have been installed which is why we were getting the problem.folder structure
After you have added --force to npm install you have all the dependencies installed. Now you can run the app with npm start.
Unfortunately, all the solutions described above didn't work on my machine...
Here is my latest solution for this problem...
This worked 100% on my machine...
Use npm i -g expo-cli
This will automatically add the required packages and also remove the unnecessary ones.
Yes, surely, you don't need to uninstall and re-install it again.
Just follow my steps.
And, you can create your expo project using expo init.
I hope my solution will help you out from this annoying problem....
I just did npm install and it worked for me, but I had do that every time I create a new expo project.
I also encountered this problem, and finally found that it was the problem of react native cli,I installed the latest version of react native cli,Expo is back to normal
This Error is regarding to the git account. expos need a git account to setup react native project
If you are using windows you need to install git in your local PC
after that open your Terminal and type this command
git config --global user.name "your_username"
git config --global user.email "your_email_address#example.com"
after that clone any github project to your local computer. it will ask to login to Github
after all these steps try expo init <projectname>
The simple way to settle that error is by using "expo-cli init app-name" instead of "expo init app-name".
I tried and worked perfectly for me. Hope it will help you guys.
i have faced a similar problem and running yarn set version 1.22.1 fix it
Run the Command Prompt as an administrator. And run the following command:
npx create-expo-app AwesomeProject

Expo fails to build, Request failed with status code 400

I'm trying to build a project in expo react native project.
My expo version is 3.2.2, sdkVersion is 35.
When I ran in cmd (on Windows 10)
set EXPO_DEBUG=true
expo build:android -c
I got:
Request failed with status code 400
Error: Request failed with status code 400
at createError (C:\Users\Jonny\AppData\Roaming\npm\node_modules\expo-cli\node_modules\axios\lib\core\createError.js:16:15)
at settle (C:\Users\Jonny\AppData\Roaming\npm\node_modules\expo-cli\node_modules\axios\lib\core\settle.js:17:12)
at IncomingMessage.handleStreamEnd (C:\Users\Jonny\AppData\Roaming\npm\node_modules\expo-cli\node_modules\axios\lib\adapters\http.js:237:11)
at IncomingMessage.emit (events.js:203:15)
at endReadableNT (_stream_readable.js:1145:12)
at process._tickCallback (internal/process/next_tick.js:63:19)
I'm tried to update expo version, sdkVersion, the version in react, check for internet connection.
Expo login and logout works fine. I don't have any proxy in my network.
I don't have any clues for what search or how to fix this problem.
Seems was a error in expo-cli version 3.2.2.
The update 3.2.3 fixed for me.
I have fixed the issue by using this command
Move to your root folder then type this command in your terminal
npm install -g expo-cli
I had two versions of expo-cli installed (one via yarn global install expo-cli and one as a dev dependency in project yarn add -D expo-cli). This started working for me after I removed the global expo-cli:
yarn global remove expo-cli
and used the local version in my project instead:
yarn run expo-cli start
Run those following command, then we are good to go.
$ yarn global remove expo-cli && yarn global add expo-cli
$ rm -rf node_modules/ yarn.lock && yarn install
$ yarn run start

How to fix error in "Copying template" when making project?

I'm generating a new project using React-Native in Command Prompt but I get an error when I use the following command:
react-native init Style
This is the result I get:
√ Downloading template
× Copying template
error Error: Cannot find module 'C:\Users\User\AppData\Local\Temp\rncli-init-template-srEvW0\node_modules\react-native\template.config'
error EBUSY: resource busy or locked, rmdir 'D:\FUSI\React Native\Style'. Run CLI with --verbose flag for more details.
Error: EBUSY: resource busy or locked, rmdir 'D:\FUSI\React Native\Style'
at Object.rmdirSync (fs.js:684:3)
at rmdirSync (D:\FUSI\React Native\node_modules\fs-extra\lib\remove\rimraf.js:276:13)
at Object.rimrafSync [as removeSync] (D:\FUSI\React Native\node_modules\fs-extra\lib\remove\rimraf.js:252:7)
at Object.initialize [as func] (D:\FUSI\React Native\node_modules\react-native\node_modules#react-native-community\cli\build\commands\init\init.js:295:26)
at process._tickCallback (internal/process/next_tick.js:68:7)
How can I fix this error?
Mustafa AK had it right. What worked for me is adding the --npm flag at the end of the command.
I followed the tutorial exactly how it was laid out on the React website and was running into the same error. For whatever reason, if you have yarn and npm installed the command to create a new project will not work. So you have to add the --npm flag to get it to only use npm and this will work.
npx react-native init AwesomeProject --npm
This Same error comes with me. But I solved by following ways...
First, uninstall the node from your system and download the latest version of node and install it.
2.after installation of the latest version of node you need to write the command in your command prompt
npm install -g react-native-cli
Now go to your project directory
cd your-react-native-project directory
now create your react-native project
react-native init your-project-name.
https://stackoverflow.com/a/71725307/16114216
Be sure uninstall global react-native/cli as described react-native tutorials
Try to use --npm end of init command if you had yarn and npm both.
npx react-native init MyApp --template react-native-template-typescript --npm
Note: If you have both yarn and npm installed on your machine, React Native CLI will always try to use yarn, so even if you use npx utility, only react-native executable will be installed using npm and the rest of the work will be delegated to yarn. You can force usage of npm adding --npm flag to the command.