What is the ideal approach for setting up the react-native CLI - local module or global installation

I've been following the initial steps to start with React Native from FB's git page at https://facebook.github.io/react-native/docs/getting-started

While using nxp or npm installed CLI during the process, I encountered the following error.

[!] Invalid `Podfile` file: [!] /Users/allen/.nvm/versions/node/v12.14.1/bin/node -e console.log(require('@react-native-community/cli').bin);

internal/modules/cjs/loader.js:796
    throw err;
    ^

Error: Cannot find module '@react-native-community/cli'
Require stack:
- /Volumes/BLUE/workspace-blue/react_native-blue/test/ios/[eval]
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:793:17)
    at Function.Module._load (internal/modules/cjs/loader.js:686:27)
    at Module.require (internal/modules/cjs/loader.js:848:19)
    at require (internal/modules/cjs/helpers.js:74:18)
    at [eval]:1:13
    at Script.runInThisContext (vm.js:116:20)
    at Object.runInThisContext (vm.js:306:38)
    at Object.<anonymous> ([eval]-wrapper:9:26)
    at Module._compile (internal/modules/cjs/loader.js:955:30)
    at evalScript (internal/process/execution.js:80:25) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [ '/Volumes/BLUE/workspace-blue/react_native-blue/test/ios/[eval]' ]
}

This issue occurs during cocoapods installation. The documentation states:

If you previously installed a global react-native-cli package, please remove it as it may cause unexpected issues.

However, this problem persists regardless of installations or methods used for creating the initial files.

The Podfile contains these lines:

platform :ios, '13.0' # <- originally set at 9.0 but changed to 13.0
require_relative '../node_modules/@react-native-community/cli-platform-ios/native_modules'

If I locally install @react-native-commuinty/cli within the project and then run pod install, everything works correctly. Should I update the CLI path to my npm directory? If the docs suggest no issues when no react-native CLI is installed, why do I need to install it for pod install to work?

Environment:

  • MacOS 10.15

  • node 12.14.1

  • ruby ruby 2.6.3p62 (2019-04-16 revision 67580) [universal.x86_64-darwin19] (attempted with rbenv 2.5)

  • xcode-select version 2373.

javascriptreact-nativenpmreact-native-iosreact-native-cli

Answer №1

Make sure to keep it local. Once you step in

npx react-native init [project name]

it will be added locally.

https://facebook.github.io/react-native/docs/getting-started

this official link suggests:

If you have previously installed a global react-native-cli package, make sure to remove it to avoid unexpected issues.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Is it possible for a memory leak to occur when a jQuery object is created within a function but never actually used?

As an illustration: function calculateTime(minutes) { var newTime = new Date(); newTime.setHours(0, minutes, 0, 0); return angular.element('<input type="hidden"/>').timepicker('setTime', newTime).val(); } I'm cu ...

javascriptjqueryhtmlangularjs

JavaScript's speciality - altering the Jquery fade in and fade out effect on Firefox browsers

Utilizing Jquery, I implemented a feature on a table where moving the mouse over a row changes its color. The Javascript code was specifically designed for IE7 and works flawlessly there. However, when tested in Firefox, the text fades along with the backg ...

javascriptjqueryfirefoxfadeinfadeout

Need a jQuery function that updates the 'id' after clicking on a specific div? Here's how to do it!

I need help simplifying my current situation. Step 1: I want to increment the variable "count" by 1 every time a specific div is clicked. Step 2: After updating "count", I want to utilize it in another function. This function involves copying the value f ...

javascriptjqueryhtmlcssvariables

Is there a way to simulate the parameters injected into an fs callback without actually interacting with the filesystem during testing?

I'm currently utilizing Chai, Mocha, and Sinon for my testing framework. At the moment, I have a functioning test, but I find myself having to set up a directory and populate it with files just to make my tests run successfully. This approach doesn&a ...

javascriptnode.jsasynchronousstubsinon

In Firefox, using the new Date function within a string does not function as expected

Why does the last log in the code snippet below not work in Firefox? (function() { String.prototype.toDate = function() { return new Date(this); }; console.log(Date.parse("2012-01-31")); console.log(new Date("2012-01-31")); c ...

javascriptfirefoxnode.jsgoogle-chrome

Using jQuery to make an Ajax post request that will load the current page with additional form data appended to the

Below is the HTML code for my registration form: <form id="registerForm"> <input type="text" pattern="[A-Za-z]{1,20}" placeholder="First Name" name="guestFName" title="Up to 20 alphabetical characters" required> <inp ...

javascriptjqueryhtmlajax

Tips for effectively creating a fresh array of objects by extracting distinct values from arrays of child elements within a collection of parent objects

We have a requirement to extract data from objects structured like this: [ { "first": { "children" : [{ "name": "abc", "detail":"123"}, { "name": "def", "detail":"456"} ] }}, { "second": { "children" : [{ ...

javascriptarraysecmascript-6

Unable to associate ngModel because it is not recognized as a valid property of the "Component"

Currently, I am in the process of creating a custom form component using Angular 4. I have included all necessary components for ngModel to function properly, but unfortunately, it is not working as expected. Below is an example of my child component: ex ...

javascriptangulartypescriptcomponentsangular-ngmodel

The scroll functionality does not seem to be functioning as intended on mobile devices when

Hey there, I'm currently working on making my navbar sticky and applying it when the page is scrolled. The code I have works flawlessly on desktop, but unfortunately, it doesn't seem to work on the mobile version. Any suggestions? window.addE ...

javascripthtmlcss

Is there a way to monitor real-time updates without relying on setInterval or timeout functions?

Currently in the process of building a social network, I am working on fetching live notifications. The current approach involves sending an AJAX request every few seconds using setInterval. The code snippet for this operation is as follows: setInterval ( ...

javascriptajaxcomet

Updating style in Javascript can sometimes be a bit tricky

What's preventing this from working? localStorage.fontSize contains the correct value, but the initial document.body.style.fontSize = localStorage.fontSize + "pt"; doesn't update the style. <script type="text/javascript> if(!localStorage. ...

javascripthtmlcss

Automatic Addition of Row Numbers Enabled

I'm currently exploring coding and experimenting with creating a scorekeeper for family games. I've managed to add rows dynamically and automatically sum up the entered information in the "total" row at the bottom. However, I'm facing an iss ...

javascriptjqueryhtmlcss

Graph is not showing up when navigating through page

On my List page (List.Html), users can select multiple rows to display the data in a chart using C3. However, when clicking on the compareList() button to navigate to the Chart page (Chart.Html), the chart does not display properly. It seems that the chart ...

javascriptangularjsionic-frameworkchartsc3.js

Is there a way to display the JavaScript widget exclusively on the homepage or main page

How can I limit the display of a Twitter widget on my blog page to only show on the main page and hide it when visitors navigate to sub-pages or individual blog entries? ...

javascripthtmltwitterblogs

Enhance the worth of text box

Is there a way to adjust the value of a textbox by one on keyup, keydown, or tap events? Check out this example. Here is the HTML structure: <div class="right-content" id="rc-0" style="height: 250px;"> <div class="right-cont-main" id="rcm-0" s ...

javascriptjqueryhtmlcss

Retrieving URL Parameters in Meteor-React's createContainer

In my React/Meteor application that utilizes react-router, I am attempting to pass the URL parameters (for example, /user/P8HDQMAuapRESoWo6) into createContainer. This function fetches the result of the initial MongoDB query: let user = Meteor.users.findO ...

javascriptmongodbreactjsmeteormeteor-react

Sorry, I am only able to provide assistance with rewriting requests that do not contain error messages or

error code 127 npm error path command failed sh -c node-gyp-build sh: node-gyp-build: command not found A complete log of this run can be found in /Users/rakibulb/.npm/_logs/2024-05-20T15_36_50_210Z-debug-0.log I recently cloned a repository that I was ...

node.jsnpmnpm-installnode-gyp

Having difficulty controlling the DOM using cheerio in a Node.js environment

I am currently working on a basic program using Node for the server side with cheerio. Here are the code snippets provided: Server Side: /** * Module dependencies. */ var express = require('express') , routes = require('./routes') ...

javascripthtmlnode.jscheerio

Perform activities within a component responsible for displaying a flatlist

I have a component called Post that I'm using to display posts within a FlatList. Currently, the Post component only shows text and images in the Flatlist. However, within the Post component, there are buttons that should have functionality such as de ...

javascriptreactjsreact-native

running into an issue while attempting to utilize socket.io

Currently, I am utilising the socket.io swift client on my Iphone SE. Below is the swift code snippet: let socket = SocketIOClient(socketURL: URL(string: "http://example.com:4000")!, config: [.log(true), .forcePolling(true)]); socket.connect(); ...

javascriptiosnode.jsswiftsockets