27

I am new to ReactJS, I was following one of the tutorials in "TutorialsPoint".

In Step 2: After the folder is created we need to open it and create empty package.json file inside by running npm init from the command prompt and follow the instructions.

C:\Users\username\Desktop\reactApp>npm init

By running the above command I am unable to create and package.json Only this thing is coming up after running init.

enter image description here

In Step 4: it asks to add dependencies and plugins

In Step 5: it asks to open the package.json and delete "test": "echo \"Error: no test specified\" && exit 1" inside "scripts" object.

Now how can I open package.json, if I was not been created from the beginning?

gfullam
  • 11,531
  • 5
  • 50
  • 64
SumitHusky
  • 307
  • 1
  • 3
  • 8
  • 1
    Did you complete the npm init wizard shown in the screen shot? – gfullam Jun 17 '16 at 18:28
  • No, In the tutorials they haven't shown how to complete that. – SumitHusky Jun 17 '16 at 18:47
  • Most ReactJS tutorials assume some basic level of understanding about Node.js and npm. I struggled with this, too. Unfortunately, you're learning more than one thing at once. See the links in my answer below for some additional detail about npm init and package.json. I have found that the best way to learn node and npm is to ask questions, because the tutorials are too assuming. While Google and SO are bountiful, I still recommend finding someone on your team or in a local dev group to pester about it ;) They'll be delighted to get you up to speed. – gfullam Jun 17 '16 at 18:51
  • Apart from making sure you complete the instructions from `npm init`, remember to be **100% sure that you are running the command in the correct directory**. I am semi-new to this and I just got stuck for 20 minutes because of this. – luek baja Sep 12 '22 at 23:11

7 Answers7

37

Complete the npm init prompts

The command npm init "will ask you a bunch of questions, and then write a package.json for you."

The first prompt, as shown in your screen capture, asks you to enter a package name. You can just hit Enter to skip through the prompts and accept the default values if you are unsure of what information to provide.

You can also use -y/--yes to skip the questionnaire altogether. For example, npm init -y. (Note: -f/--force also work.)

Each prompt corresponds to a field in the package.json file. Consequently, you can construct this file yourself or copy and modify an existing one from another project.

gfullam
  • 11,531
  • 5
  • 50
  • 64
  • 6
    Thanks @gfullam It worked, just added a simple " npm init -f ". which created package.json file, then followed rest of the tutorial and its working fine. – SumitHusky Jun 17 '16 at 20:06
  • @gfullam how to reset the npm init? – JinSnow Aug 06 '19 at 07:40
  • 1
    @JinSnow You can delete `package.json` run `npm init` again for a fresh start. You may also run `npm init` at any time and it will walk walk you through the same prompts with your existing values as placeholders that you can accept or change. You can also just open `package.json` and modify it to suit your needs. – gfullam Aug 07 '19 at 15:06
  • Don't forget you might have to open a folder first. Like in VS Code, if you haven't opened a folder (can be empty) it won't work! – Sjardi Djoy Willems Jan 10 '23 at 01:06
3

A package.json must have:

  • A name all lowercase one word, no spaces, dashes and underscores allowed;
  • A version in the form of x.x.x;

There are two ways to create a empty package.json file:

  1. Run a CLI questionnaire to create a package.json with values that you supply. For that run the command:

    npm init

  2. Create a default package.json. For that you just need to run the same command but with the --yes or -y flag.

    npm init --yes

and it will create the package.json file in the dir where you run the command and will display the code shown bellow:

{
  "name": "reactApp",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}
Community
  • 1
  • 1
AnoopDixit
  • 209
  • 2
  • 6
1

Generally, it is not required for installing packages. If you don't use npm init for the folders, all the package can work without it.

Also for solving this problem, you should use

npm init --yes

when used with --yes then it is available the .json file in the directory. Also, the information on the .json file is dependent on the package that you had installed.

Jason Aller
  • 3,541
  • 28
  • 38
  • 38
Ardalan Farkhondeh
  • 66
  • 3
0

I am new on npm. I got confused just like you when i was trying to follow the npm tutorial. You just need to press the 'Enter' key on your keyboard after your step2. When you press 'Enter', you give default value to it. So it's gonna generate the json file based on its default information... hope it helps.

Yiqiuuu
  • 1
  • 3
0

I had same problem in my project directory. when i run npm init it gives Error that package.json not found, complete log found in something like this " c:/user/node_modules/...".

This is because it overwrites the existing package.json file or the file path is not correct. Also Admin permission is not granted to create such file. so try VS Code or IDE you all use to run as Administrator.

So, i put my project in the other Drive **(E: drive) and then run npm init** it works fine and create package.json file.

akshay_sushir
  • 1,483
  • 11
  • 9
0

I fall onto this problem, when I typed npm init and press enter:

D:\React\booking>npm init
npm ERR! code MODULE_NOT_FOUND
npm ERR! Cannot find module './util.js'
npm ERR! Require stack:
npm ERR! - C:\Users\Sabbir\AppData\Roaming\npm\node_modules\npm\node_modules\libnpx\index.js
npm ERR! - C:\Users\Sabbir\AppData\Roaming\npm\node_modules\npm\lib\init.js
npm ERR! - C:\Users\Sabbir\AppData\Roaming\npm\node_modules\npm\lib\npm.js
npm ERR! - C:\Users\Sabbir\AppData\Roaming\npm\node_modules\npm\bin\npm-cli.js

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\Sabbir\AppData\Roaming\npm-cache\_logs\2020-07-13T05_58_52_734Z-debug.log
Sabbir Pulak
  • 9
  • 2
-1

Here is the answer that helps a lot about this problem

Follow these steps, closely:

http://nodejs.org/download/ download the 64 bits version, 32 is for hipsters Install it anywhere you want, by default: C:\Program Files\nodejs Control Panel -> System -> Advanced system settings -> Environment Variables Select PATH and choose to edit it. If the PATH variable is empty, change it to this: C:\Users{YOUR USERNAME HERE}\AppData\Roaming\npm;C:\Program Files\nodejs

If the PATH variable already contains C:\Users{YOUR USERNAME HERE}\AppData\Roaming\npm, append the following right after: ;C:\Program Files\nodejs

If the PATH variable contains information, but nothing regarding npm, append this to the end of the PATH: ;C:\Users{YOUR USERNAME HERE}\AppData\Roaming\npm;C:\Program Files\nodejs

Now that the PATH variable is set correctly, you will still encounter errors. Manually go into the AppData directory and you will find that there is no npm directory inside Roaming. Manually create this directory.

Re-start the command prompt and npm will now work.

Installing Node.js (and npm) on Windows 10

Ali Khurram
  • 77
  • 5