'next' is not recognized as an internal or external command

avatar
Borislav Hadzhiev

Last updated: Apr 4, 2024
5 min

banner

# Table of Contents

  1. 'next' is not recognized as an internal or external command
  2. create-next-app: command not found error

# 'next' is not recognized as an internal or external command

The error "'next' is not recognized as an internal or external command, operable program or batch file" occurs when we forget to install the dependencies in a Next.js project.

To solve the error, run npm install react react-dom next to install next before running npm run dev.

next is not recognized as internal or external command

Open your shell in your project's root directory (where your package.json is) and run the following commands.

cmd
# ๐Ÿ‘‡๏ธ if you use npm npm install npm install react react-dom next npm run dev # ๐Ÿ‘‡๏ธ if you use yarn yarn install yarn add react react-dom next yarn dev

Once you run npm install or yarn install and install the react, react-dom and next packages, you will be able to issue the npm run dev command without getting any errors.

npm install next

If the error is not resolved, try to delete your node_modules and package-lock.json (not package.json) files, re-run npm install and restart your IDE.
cmd
# ๐Ÿ‘‡๏ธ (Windows) delete node_modules and package-lock.json rd /s /q "node_modules" del package-lock.json # ๐Ÿ‘‡๏ธ (macOS/Linux) delete node_modules and package-lock.json rm -rf node_modules rm -f package-lock.json # ๐Ÿ‘‡๏ธ clean your npm cache npm cache clean --force # ๐Ÿ‘‡๏ธ install packages npm install npm run dev
Make sure to restart your IDE and dev server if the error persists. Visual Studio Code often glitches and a reboot solves things sometimes.

Alternatively, you can create a new Next.js project with the following command.

cmd
npx create-next-app@latest

If the error persists, add npm to your PATH environment variable manually.

# Add npm to your PATH environment variable

To add npm to your PATH environment variable:

  1. Click on the Search bar and type "environment variables".
  2. Click on "Edit the system environment variables".

edit system environment variables

  1. Click on the "Environment Variables" button.

click environment variables

  1. In the "System variables" section, select the "Path" variable and click "Edit".

select path and click edit

  1. Click on "New" and then click "Browse".

click new browse

  1. Your npm directory is most likely located under %USERPROFILE%\AppData\Roaming\npm or in other words, C:\Users\YOUR_USER\AppData\Roaming\npm.
location
%USERPROFILE%\AppData\Roaming\npm # ๐Ÿ‘‡๏ธ same as below (make sure to replace YOUR_USER) C:\Users\YOUR_USER\AppData\Roaming\npm

If you can't find it, run the npm config get prefix command.

cmd
npm config get prefix

npm config get prefix

  1. Add the path to npm and click on "OK" twice to confirm.

  2. Close your Command prompt application and then reopen it.

Note that you must restart your Command prompt shell for the changes to take effect.
  1. Try to issue the npm run dev command after you've restarted your shell.

# create-next-app: command not found error

Use npx to solve the error "create-next-app: command not found", e.g. npx create-next-app@latest or install the package globally by running npm install -g create-next-app@latest to be able to use the command without the npx prefix.

command not found create next app

The fastest way to solve the error is to use the npx command.

shell
# ๐Ÿ‘‡๏ธ create js app npx create-next-app@latest # ๐Ÿ‘‡๏ธ for a TypeScript project npx create-next-app@latest --typescript # ๐Ÿ‘‡๏ธ Print package version npx create-next-app@latest --version

Alternatively, you can install create-next-app globally.

shell
# ๐Ÿ‘‡๏ธ install the package globally npm install -g create-next-app@latest # ๐Ÿ‘‡๏ธ create js app create-next-app # ๐Ÿ‘‡๏ธ for a TypeScript project create-next-app --typescript # ๐Ÿ‘‡๏ธ print package version create-next-app --version

If the global installation of create-next-app fails, you might have to run the command prefixed with sudo.

shell
# ๐Ÿ‘‡๏ธ if you got a permissions error sudo npm install -g create-next-app@latest # ๐Ÿ‘‡๏ธ create js app create-next-app # ๐Ÿ‘‡๏ธ for a TypeScript project create-next-app --typescript # ๐Ÿ‘‡๏ธ print package version create-next-app --version

Refer to the official npm page of the create-next-app package for command options.

If the "create-next-app: command not found" error is not resolved, try restarting your terminal.

# Update your PATH environment variable on macOS or Linux

If that doesn't help, run the following command:

shell
npm config get prefix

The command will show you the path where npm puts your globally installed packages. The global packages will be in the bin directory at the specified path.

Look at the PATH environment variable on your operating system and add the path that the npm config get prefix command outputs if it's not already there.

If you add the output from the command to your PATH environment variable, you have to restart any open command prompts before it takes effect.

If that didn't work, try to add the path to the bin folder (from npm config get prefix) to your PATH environment variable and restart your terminal.

For example, on macOS, you can update your path with the following command:

shell
# make sure the path matches with `npm config get prefix` output export PATH=/usr/local/share/npm/bin:$PATH

If you are on Linux, you can add the output from the npm config get prefix command to your .bashrc file.

~/.bashrc
# ๐Ÿ‘‡๏ธ make sure to update the path with the output # from the command export PATH="/usr/local/share/npm/bin:$PATH"
If you add the output from the command to your PATH environment variable, you have to restart any open command prompts before it takes effect.

If that doesn't help try to reinstall Node.js on your machine and then install create-next-app globally by running npm install -g create-next-app@latest.

During the installation, you might get a prompt for whether you want to automatically update the PATH environment variable on your system, make sure to tick the option.
shell
# ๐Ÿ‘‡๏ธ install package globally npm install -g create-next-app@latest # ๐Ÿ‘‡๏ธ create js app create-next-app # ๐Ÿ‘‡๏ธ for a TypeScript project create-next-app --typescript # ๐Ÿ‘‡๏ธ print package version create-next-app --version
If the global installation of create-next-app fails, you might have to run the command prefixed with sudo.
shell
# ๐Ÿ‘‡๏ธ if you got a permissions error sudo npm install -g create-next-app@latest # ๐Ÿ‘‡๏ธ create js app create-next-app # ๐Ÿ‘‡๏ธ for a TypeScript project create-next-app --typescript # ๐Ÿ‘‡๏ธ print package version create-next-app --version

Alternatively, you can see how you can fix the permissions error on this page in the official npm docs.

# Additional Resources

You can learn more about the related topics by checking out the following tutorials:

I wrote a book in which I share everything I know about how to become a better, more efficient programmer.
book cover
You can use the search field on my Home Page to filter through all of my articles.

Copyright ยฉ 2024 Borislav Hadzhiev