React Native error: TypeError: cli.init is not a function

Abdul D.

—June 15, 2024

The ProblemJump To Solution

When initializing a new React Native project using npx, you may get this error:

TypeError: cli.init is not a function at run (/opt/homebrew/lib/node_modules/react-native-cli/index.js:302:7) at createProject (/opt/homebrew/lib/node_modules/react-native-cli/index.js:249:3) at init (/opt/homebrew/lib/node_modules/react-native-cli/index.js:200:5) at Object.<anonymous> (/opt/homebrew/lib/node_modules/react-native-cli/index.js:153:7) at Module._compile (node:internal/modules/cjs/loader:1112:14) at Module._extensions..js (node:internal/modules/cjs/loader:1166:10) at Module.load (node:internal/modules/cjs/loader:988:32) at Module._load (node:internal/modules/cjs/loader:834:12) at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:77:12) at node:internal/main/run_main_module:17:47

This issue typically arises due to a mismatch between the installed versions of the React Native CLI and its associated dependencies. As a result, the CLI package is not compatible with the version of React Native being used to initialize your project. These conflicts can occur if you have global versions of React Native or its CLI installed, which is not generally recommended.

The Solution

To resolve this issue, clean your global environment of any conflicting installations. Here’s the step-by-step process.

First, remove any global installations of React Native and its CLI using npm:

npm uninstall -g react-native
npm uninstall -g react-native-cli

Ensure that nothing related to React Native is present in the global package list to help verify that all old or conflicting packages have been removed:

npm -g list

Check the output and ensure that react-native and react-native-cli are not listed. If they are still listed, remove them using the commands above. After removing the global packages, use npx to initialize your project. The npx command lets you use the React Native CLI without installing it globally:

npx react-native init newProject

Using npx also ensures you’re using the latest version of the CLI directly from the npm registry without permanent installation.

Consider Using Expo

The React Native documentation now recommends using Expo, especially for those new to mobile development. Expo is a framework for universal React applications that simplifies the process of creating React Native apps and eliminates the need for native code configurations:

npx create-expo-app newProject

Expo is a great alternative if you encounter persistent issues and need a more straightforward setup.

Reinstall react-native-cli Globally (If Needed)

If the above methods do not resolve the issue, or for any reason you find it necessary to have React Native installed globally, reinstall react-native-cli globally using:

npm install -g react-native-cli

Installing the React Native CLI globally isn’t typically recommended but can be helpful in specific environments such as CI/CD pipelines.

When you run react-native init newProject, the CLI should automatically install react-native locally in your project directory.