Package.json

Package.json is nothing but sister of Maven build tool

Package.json is a build tool available for npm packages, it can install the required packages to run a particular system, It will install npm packages only if the mentioned packages are not present in system

Package.json tracks all your installations of npm packages, so when you want to install in different machine rather than using the individual commands you can use the package.son file to install them all together. Package.json not only tracks the installation it also tracks the dependencies for your installations

if you ask, is that all ?
Obviously no, using he package.json file we can also run our script, the major advantage will come when you want to run your script in remote machine, there you cannot install packages one by one, so those cases you just need to fire one single command to install all the packages from package.json and to one command to run the code.

If you are fresher you might get a double like why would we fire commands rather than running in IDE, IDe will be present in you local system not in your grid machine when you are using the CI tools like jenkins, or bamboo.

Let's install a npm module without using the package.json, for example purpose i will install jasmine module. no-such-file-or-directory-package-json In above image, I have highlighted a line which says

npm WARN enoent ENOENT: no such file or directory, open 'D:\package test\package.json'

Basically whenever you try to install a npm module, it will look for package.json file to make entry of the installation, but there is no such so we got the warning.

Generate/Create package.json

Let's create package.json file and then try some installation, package.json file is present in the same folder as tsconfig.json for this example.

  1. open your cmd and navigate to the folder where your tsconfig.json is present or you can use your IDE terminal
  2. Enter below command to create a package.json file
    
    									npm init		
    									
  3. Now you can see, some inputs are expected from you please do these details. npm-init-details-package-json In few placed i have entered nothing just pressed enter, but you do make sure you enter some value for test property, we would be using this command to start a test
  4. After entering all the details npm show the details to verify, please verify by entering yes verify-npm-init-package-json-details
  5. Now go the folder with your file explorer and open the package.json file (I hope it will be there, just kidding), and verify details
  6. Now go the command prompt try to install any module, I will try to install typescript module and its dependencies like below npm-package-json-entry In above image you donot see the warning saying package.json is missing
  7. Lets reopen the package.json file and check whether there is entry for typescript module package-json-typescript-dependency
  8. Now my protractor folder structure should look like below package-json-typescript-dependency
  9. Similar to this either you need to populate all the npm module either typing them or by installing
  10. Now I will delete all the npm_modules folder to check whether this works or not, now the folder structure looks like folder-structure-package-json
  11. Now I have filled all the required details in package.json file for installing the required node modules.
    
    {
      "name": "cherchertech",
      "version": "1.0.1",
      "description": "this is to showcase the package.json tutorial",
      "main": "index.js",
      "dependencies": {
        "jasmine": "^3.2.0"
      },
      "devDependencies": {
        "@types/jasmine": "^2.8.8",
        "jasmine": "^3.2.0",
        "protractor": "^5.4.1",
        "typescript": "^3.0.3"
      },
      "scripts": {
        "test": "protractor conf.js"
      },
      "keywords": [
        "cherchertech",
        "package",
        "tutorial",
        "protractor"
      ],
      "author": "karthiq",
      "license": "ISC"
    }
    
    
  12. Open cmd on the same folder as package.json, and type npm install npm-install-package-json
  13. After the above command, the folder structure will have a node modules folder as well as the installed software. npm-node-modules-installations-protractor

Run the code after compiling

Try to compile the code using the tsc, I am just compiling and I will not watch for changes as I know there is no changes, so i am not using -w with compilation command

Run the code after compilation using npm install, I hope you remember that we have configured the protractor conf.js command while setting up the package.json file. package-json-protractor-run With all these we have reduced the burden of installing the npm packages for protractor, lest create more useful package.json in next steps.

Pre-Install & Post-install in Package.json

install:

install command will install the packages mentioned in the package.json, you do not have to write the install property in package.json explicitly.

preinstall:

preinstall step runs just before installing the packages, this might be useful to delete any files npm if anything exist, we can write commands like npm clear cache, to remove the files from mode_modules folder.

postinstall:

postinstall steps runs after installing the packages, and i am not sure what to write here so explore yourself.

preinstall, postinstall are are executed when user uses npm install command I have added a step for presintall, and ignoring the post install as i don't anything to run after install.


"scripts": {
	"preinstall":"npm cache clear",
	"test": "protractor conf.js"
},

You cannot run preinstall, postinstall separately, they will be executed only with install

test & pretest & posttest in package.json in protractor

test

test command is is configured with the command to start the execution, with protractor we would be using protractor conf.js to start the execution, So i would be adding it to the test command.

pretest

pretest will be executed before executing the test command in cmd/terminal. When you are working in typescript it is always important to compile the script to JS before running the tests. So I am adding compilation command in pretest I hope you know the compilation command tsc

posttest

postinstall is executed after the execution of the test command, we can write commands like sending mails ore clearing unwanted files.

I will add command to remove node modules folder, but it is not better idea as you might need to install the packages again. ( but there nothing wrong in trying). pretest, posttest are executed when user uses npm test command


"scripts": {
	"preinstall":"npm cache clear",
	"pretest":"tsc",
	"test": "protractor conf.js",
	"posttest":"rmdir node_modules"
},

You cannot run pretest, posttest separately, they will be executed only with test

Things I learned while writing this tutorial

When tsc is configured in pretest and if any error occurs in compilation of ts code to js then package.json will be stopped, so the commands after compilation will not get executed [ whatever happens the compilation will be completed ]

So as alternate, i have added the tsc to the postinstall command, which also thrown the compilation error but it didnot stop the process. No complete package.json file will look like below.


{
  "name": "cherchertech",
  "version": "1.0.1",
  "description": "this is to showcase the package.json tutorial",
  "main": "index.js",
  "dependencies": {
    "jasmine": "^3.2.0"
  },
  "devDependencies": {
    "@types/jasmine": "^2.8.8",
    "jasmine": "^3.2.0",
    "protractor": "^5.4.1",
    "typescript": "^3.0.3"
  },
  "scripts": {
	"preinstall":"npm cache clear",
	"postinstall":"tsc",
	"test": "protractor conf.js",
	"posttest":"rmdir node_modules"
  },
  "keywords": [
    "cherchertech",
    "package",
    "tutorial",
    "protractor"
  ],
  "author": "karthiq",
  "license": "ISC"
}

Running the package.json

I have created the this tutorial as main purpose for running the code in jenkins or any other ci tools. So Run below three commands to execute


npm install
npm test
#

I have used the # for no use, when we write anything on cmd we have to hit enter, if we donot it will start the command. When i type two lines of only first line gets executed but second line will as it expects an enter key to be pressed.

So I have used the # commands to make the cmd to realize that there is one more command, so that it will execute the second line. final-commands-package-json-protractor

All packages Json Commands

One thing you need to understand is that you cannot create custom commands in package.json, below are the commands present in package.json

npm supports the "scripts" property of the package.json file, for the following scripts:

  • prepublish: Run BEFORE the package is packed and published, as well as on local npm install without any arguments. (See below)
  • prepare: Run both BEFORE the package is packed and published, and on local npm install without any arguments (See below). This is run AFTER prepublish, but BEFORE prepublishOnly.
  • prepublishOnly: Run BEFORE the package is prepared and packed, ONLY on npm publish. (See below.)
  • prepack: run BEFORE a tarball is packed (on npm pack, npm publish, and when installing git dependencies)
  • postpack: Run AFTER the tarball has been generated and moved to its final destination.
  • publish, postpublish: Run AFTER the package is published.
  • preinstall: Run BEFORE the package is installed
  • install, postinstall: Run AFTER the package is installed.
  • preuninstall, uninstall: Run BEFORE the package is uninstalled.
  • postuninstall: Run AFTER the package is uninstalled.
  • preversion: Run BEFORE bumping the package version.
  • version: Run AFTER bumping the package version, but BEFORE commit.
  • postversion: Run AFTER bumping the package version, and AFTER commit.
  • pretest, test, posttest: Run by the npm test command.
  • prestop, stop, poststop: Run by the npm stop command.
  • prestart, start, poststart: Run by the npm start command.
  • prerestart, restart, postrestart: Run by the npm restart command. Note: npm restart will run the stop and start scripts if no restart script is provided.
  • preshrinkwrap, shrinkwrap, postshrinkwrap: Run by the npm shrinkwrap command.

About Author

Myself KarthiQ, I am the author of this blog, I know ways to write a good article but some how I donot have the skills to make it to reach people, would you like help me to reach more people By sharing this Article in the social media.

Share this Article Facebook
Comment / Suggestion Section
Point our Mistakes and Post Your Suggestions

Recent Addition

new tutorial Selenium Online Training : Our next online training course for Selenium with Java starts from 17th December 2018.

You can attend first 3 classes for free, the total course fee is INR 10,000

The course time would be 8.00 PM(IST) for the first three classes

If you are interested to learn, then you can join the course by sending email to chercher.tech@gmail.com

or Register below


 
Join My Facebook Group
Join Group