Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Lets learn-understand-practice and master the basics of NPM-Node-Package-Manager. Will explain and cover what why and how to use NPM - Node Package Manager. This Node-NPM Tutorial will help/ease in understanding the basic building, needs and fundamentals of NPM and ultimately give a head start in Nodejs.

NotificationsYou must be signed in to change notification settings

dinanathsj29/npm-node-package-manager-tutorial

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

85 Commits
 
 
 
 
 
 

Repository files navigation

NPM - Node Package Manager

NPM - Node Package Manager

NPM - Node Package Manager beginners to advanced tutorial

NPM - Node Package Manager - Mastering the basics tutorial for all

NPM stands forNode Package Manager. NPM is a package manager for Node/JavaScript packages or modules. It is the largest ecosystem of code/packages in the open-source code community. It helps to automate installations and updations of dependent packages/modules/dependencies.

Welcome

Hi All, I'mDinanath Jayaswal, Senior UI/Web Developer and Adobe Certified Expert Professional, I wanna welcome you toNPM - Node Package Manager - Mastering the basics tutorial for all.

About the Course/Tutorial

This is a comprehensive & concise tutorial to learn/use the NPM - Node Package Manager. This complete & compact guide explains everything you want to know/learn about the NPM - Node Package Manager. This module will learn basics to advanced NPM commands which helps to manage application dependencies with package.json file.

NPM makes it easy for javascript developers to publish, share and reuse codes, and also makes it easy to update the codes with NPM Registry.

This Node-NPM Tutorial will help/ease in understanding the basic building, needs and fundamentals of NPM and ultimately give a head start in Nodejs.

Who is this for?

This Course/Tutorial is ideal for:

  • Candidates/Professionals who want to learn and master the basics of NPM commands
  • JavaScript developers who want to know how to properly use NPM - Node Package Manager
  • JavaScript/Node lovers want to acquire knowledge of NPM
  • Professionals desire to become NPM Expert by publishing their own NPM modules/packages for other developers
  • Developers who know JavaScript and wants to dive deeper with upcoming Node/NPM features
  • Any Web designer/developer interested in getting a deep understanding of NPM - Node Package Manager
  • Anyone with a passionate mindset to learn new/latest/upcoming tools/technologies/concepts/web standards to sharpen/improve their skills

Course/Tutorial achievement

Course/Tutorial Goal

After completing/attending/finishing this Course/Tutorial, participants should be able to:

  • Understand What-Why of Node, NPM, also how to use
  • Get a strong understanding of various npm commands and be able to make use of npm for Node, Angular, React and other similar technologies
  • Initialize and Setup new project/app usingnpm init
  • Understand the purpose ofpackage.json andpackage-lock.json file
  • Work with project dependencies and development dependencies (manage, list, update, remove dependencies as per requirement)
  • Discover the Semantic versioning system (Semver)
  • Configure NPM scripts and execute them
  • Publish, update own solutions/package/modules to the npm registry

Prerequisites for current course / What you need to know

  • Basic/Intermediate knowledge of HTML5 and CSS3
  • Basics of JavaScript will be an added advantage
  • How to use a text editor such as Notepad++, Sublime Text and/or IDE like Visual Studio Code
  • How to use Command Line Tool, Terminal, Command Prompt to type a basic commands

Topics included/covered

  1. Introduction to Node-Nodejs

  2. Introduction to NPM

  3. Getting started with NPM

  4. Installation of the NPM packages |Dealing with NPM packages NPM Registry

  5. Using a Extermal Package |Using a Extermal Third Party Package

  6. Package Dependencies |Package Dependency Management

  7. NPM Packages and Source Control

  8. NPM Scripts

  9. Creating and Publishing a Package to NPM Registry

  10. NPM Resources

1 Introduction to Node-Nodejs

1.1. What is Node-Nodejs

Node/Nodejs

  • Node is a cross-platform, open-source runtime environment for executing JavaScript outside the browser i.e. at the server. We often use Node to build back-end services ie. API (Application Programming Interface)
  • Node is ideally used to build Highly-scalable, data-intensive, real-time back-end services bases applications
  • Nodejs is one of the most powerful and popular server technology. Google Chrome's V8 JavaScript engine is the core of Nodejs
  • Node/Nodejs is open source server environment, it uses JavaScript on server
  • Nodejs is a JavaScript runtime/code built on Google Chromes V8 javascript runtime engine. The V8 engine is written in C++ language which takes node(javascript) code and quickly compile/convert to machine code
  • Nodejs can be defined/described with the following important terms:
    • Asynchronous
    • Non-blocking
    • Event-Based
    • Single thread / Single-threaded

1.2. Why Node

  • Great for prototyping and agile development
  • Super-fast and highly scalable
  • Non-blocking - Asynchronous nature (more tasks/code run at a time)
  • JavaScript is a programming language used everywhere (Front-end + Back-end)
  • Cleaner and more consistent codebase/source code
  • The largest ecosystem of open-source libraries
  • Great open-source community support

1.3. What Node can do

Node/Nodejs can perform/do the following important things:

  • Generate Dynamic page content
  • Can Create, Open, Read, Write, Delete files on the server
  • Collect Form Data
  • Can perform CRUD (Create-Add, Read, Update-Edit/Modify, Delete) operation in Database

1.4. Installing Node

1.4. Installing Node/NPM

1.4. Install/Setup Node/NPM

In this section, we will learn how to set up a local development environment by installing Node/NPM:

  • NPM bundled and shift with Nodejs. In order to have NPM on our machine, we just need to download and install Node
  • NPM is pre-built with Node/Nodejs so it gets installed automatically - no need to install it separately
  1. To verify node/npm available/installed on machine, type command:
    • node -v /node --version
    • npm -v /npm --version
  2. If Node not available on machine than download and Install latest nodejs installer as per your OS, and continue installation (website:https://nodejs.org/en)
    • One can install LTS (Long Term Support) verion or current latest version anything is fine

   

nodejs website

    Image - Nodejs website -https://nodejs.org/en

  1. After installation, check installed version of node and npm or verify installation by using command:
    • To get/check version of node, command:node -v /node --versionOR
    • To get/check version of npm, command:npm -v /npm --version

2 Introduction to NPM

2.1. What is NPM

NPM - Node Package Manager

  • NPM stands forNode Package Manager
  • It is responsible for managing all the Node.js packages/dependencies and modules present in an application
  • NPM comesbundled with Node/Nodejs, so it gets installed directly/automatically with Node
  • NPM is the default package manager for Node, and it's fully written/coded/developed in JavaScript
  • NPM (Node Package Manager) is a command-line tool and registry for Third-Party Library(s) which we can add to our Node/Nodejs application
  • Node Package Manager is the largest ecosystem (software registry) in the open-source code community. It helps to automate installations and updations of dependent packages
  • For any types of functionality, we need to incorporate/add-in application, most probably a free, open-source Node library/package/module available with NPM
  • Now a days NPM is a very popular/well-known term among the Web Development community. NPM is a package manager for Node/JavaScript packages or modules
  • Developed byIsaac Z. Schlueter, initially released inJan-2010

2.2. Package Manager Module Manager

2.2. Package Management System

2.2.1. Package-Module


The package is nothing but just acollection of code ready to use, it is usually managed and maintained with a package management system.

Sometimes word Package is alternatively used in place of Module. Package/Module is nothing but a single or bunch of reusable code file(s) wrapped together with a special file namedPackage.json

  • What is a Package?
    • A Packages contains all the files which are needed for a module(s)
  • What is a Module(s)?
    • Module(s) are the JavaScript libraries that can be included in Node projects as per the requirement

2.2.2. Package Management System


  • Software that automates installing and updating packages as and when required
  • Package Management System Software deals with what version developer/user needs, and it also manages dependencies

2.2.3. Dependencies


  • Code/program/Instructions that another set of Code/program depends on to function (Like We use particuler set of code in our app, it is a dependency - our app depends on it. It may be possible that current code depends on some other code and have some other dependencies)

2.3. NPM Role-functionality

  • It provides an online repository for Node/NodeJs Packages/modules/utilities which we can easily search at
  • It equips/provides a CLI (Command Line Interface) utility to install Node/NodeJs Packages
    • CLI helps/allows the developers to interact with their systems locally also perform version management and dependency management for Node/NodeJs Packages
  • NPM allows/helps developers to publish their solution(s) code/package/module into NPM Registry so that other developers facing the same issue can re-use the code by installing the required NPM package/module
  • NPM is a way to share code with other developers worldwide, also re-use the code of other developer and easily manage different version of the code base
  • Helps to incorporate the pre-built packages into the project
  • Assists in downloading various stand-alone tools which can be used any time/right away (adapting any packages as and when the need arises )
  • Withnpx we can run and use packages without downloading it
  • Developers can share their code with other worldwide NPM users/developers
  • It helps in restricting the code to the specific or particular group of developers (forming virtual team using orgs/organizations)
  • Helps in managing and maintaining various versions of codes and their dependencies
  • NPM automatically updates the application with the update in the codes

   

npmjs website

    Image - Npmjs website -https://www.npmjs.com/

2.4. Advantages of NPM

  • Completely free and open source
  • Simpler than SOAP (Simple Object Access Protocol)
  • Default package manager of Nodejs
  • World's largest software registry (The largest ecosystem of open-source libraries)
  • Fully developed in JavaScript
  • Manage local and global dependencies of project/application/tool
  • An easy and fast CLI (Command Line Interface) utility to install packages/modules/solutions

3 Getting started with NPM

3.1. Installing NPM

3.1. Install/Setup NPM

3.1. Getting/Downloading/Installing/Setting up NPM

In this section, we will learn how to set up a local development environment by installing NPM:

  • NPM bundled and shift with Nodejs. In order to have NPM on our machine, we just need to download and install Node
  • NPM is pre-built with Node/Nodejs so it gets installed automatically - no need to install it separately
  1. To verify node/npm available/installed on machine, type command:
    • node -v /node --version
    • npm -v /npm --version
  2. If Node not available on machine than download and Install latest nodejs installer as per your OS, and continue installation (website:https://nodejs.org/en)
    • One can install LTS (Long Term Support) verion or current latest version anything is fine

   

nodejs website

    Image - Nodejs website -https://nodejs.org/en

  1. After installation, check installed version of node and npm or verify installation by using command:

    • To get/check version of node, command:node -v /node --versionOR
    • To get/check version of npm, command:npm -v /npm --version
  2. To install specific npm version command:

    • Syntax:npm install -g npm@version_number (-g flag is to install globally)
    • Command:npm install -g npm@x.x.x,npm install -g npm@8.2.1
  3. If any permission error occurs:

    • MacOS

      • Run any node/npm commands assudo oradministrator, command:sudo npm install -g orsudo npm i -g
    • Windows

      • Open Command Prompt/Terminal Window with Administrative privileges, Right Click on Terminal (Windows Command Prompt) Icon/Programm -> Choose Run As Administrator

3.2. NPM Help

3.2. Getting NPM Help

  • Getting/Using help with Node/NPM is pretty simple, generally-h or-help or--help flag is used to get/show help about npm or any other npm command
  • Syntax: Get NPM help:npm -h ORnpm -help ORnpm --help
  • Syntax: Get any NPM command help:npm <command_name> -h ORnpm <command_name> -help ORnpm <command_name> --help
  • npm -h ORnpm -help ORnpm --help command shows typical usage of NPM and various sub-flag/options available to use
  • Example: To get npm help:npm -h ORnpm -help ORnpm --help
  • Example: To get help of install command:npm install -h ORnpm install -help ORnpm install --help

   

Getting npm help with npm -h

    Image - 3.2.1 - Getting npm help with npm -h


   

Getting npm help for specific command | npm install -h

    Image - 3.2.2 - Getting npm help for specific command | npm install -h

3.3. Package json init

3.3.1. package json


Package.json is an important file for any Node or similar applications, let learn and understand some facts about it:

  • For any Node application, thepackage.json file is the heart or main file of the entire application
  • package.json file is basically the entry point ormanifest file that contains the genericmetadata/information about Node application-project in the form of (application name, version, author, license, dependencies, etc.) of the project
  • It is present in theroot directory of any Node/Angular/React or similar application and/ornode_modules folder, used to define/contains properties of a package (metadata specific to the project)
  • If we want to create a public package/module or many peoples working on the same distributed project/package/module then its advisable to create a package.json file at the root of the project
  • One can create package.json file with different ways like:
    • manually
    • through node/npm command:npm init,
    • with yarn command:yarn init
  • To create package.json file use npm command:npm init and answer basics questions related to the application like application name, version, author, license details, project/application description, dependencies, etc.
    • command:npm init - initialize the project and create a package.json file
  • command:npm init -y ORnpm init --yes (the-y or--yes flag take default answers of questions and create a package.json file directly)
    • -y OR--yes flag skips all questions and creates package.json with default values

   

Package.json with npm init

    Image - 3.3.1.1 - Package.json with npm init

Syntax & Example:3.3.1.1-package-json-basic/package.json

{"name":"learning-package-json","version":"1.0.0","description":"Introduction to package.json with creation by using\"npm init\" command","main":"index.js","scripts": {"test":"echo\"Error: no test specified\" && exit 1"  },"keywords": ["package","init","learning","npm"  ],"author":"Dinanath Jayaswal","license":"MIT"}

   

Package.json

    Image - 3.3.1.2 - Package.json


   

Package.json with npm init -y

    Image - 3.3.1.3 - Package.json with npm init -y

Syntax & Example:3.3.1.3-package-json-yes/package.json

{"name":"3.3.1.3-package-json-yes","version":"1.0.0","description":"","main":"index.js","scripts": {"test":"echo\"Error: no test specified\" && exit 1"  },"keywords": [],"author":"","license":"ISC"}

   

Package.json with -y flag

    Image - 3.3.1.4 - Package.json with -y flag

Each package or dependencies have proper/meaningful version - let us learn aboutSemVer or Semantic VersioningSemVer |Semantic Versioning now!

3.3.2. package-lock json


  • package-lock.json is automatically generated for any operations where npm modifiesnode_modules orpackage.json

3.3.3. package json benefits


Package.json files provide the following benefits:

  • Holds various metadata relevant to the project
    • contains project-specific metadata/information (application name, version, author, license, dependencies, etc.)
  • Manage dependencies of project/application
    • Any package and its version (popular npm packages are: nodemon, express, lodash, moment, etc.)
  • Scripts section: (Helps to write initial build scripts for project/application)
    • Commands/Process/Steps to run initially/by default

3.3.4. Basic-Common Project File Folder Structure-Architecture


Files/FoldersDescription
**Folders:**
node_modulesThe packages specified inpackage.json file are installed into this folder (node_modules) when werun npm install command. Also providesnpm packages/dependencies to the entire workspace/projects (node_modules folder consists of all installed packages mentioned in package.json)
**Files:**
package.jsonContains the packages to build and run our angular application, consists of Node/NPM library/package/module dependencies for application development. Custom script can also be added in as per requirements

It contains two sets of packages:
1.dependencies: The dependencies are essential for running the application, and
2.devDependencies: The devDependencies are only required to develop the application

These packages mentioned inpackage.json are installed into thenode_modules folder by theNode Package Manager (npm), whennpm install command is executed.

"scripts" property contains the useful and importantnpm commands needed to run/serve project
package-lock.jsonProvides version information for all packages installed into node_modules by the npm client

3.4. SemVer

3.4. Semantic Versioning

3.4. Semantic Versioning System

  • Change is nature's thumb rule, so every tool/technology/framework/library developed have to room for improvement

  • Versioning:

    • Specifying what version of a set of code this is
    • It helps others to track if a new version has come out/released
    • This allows to watch for a new feature or to watch forbreaking changes if any
  • Semantic:

    • The wordsemantic implies that something conveys meaning (meaningful)
    • Semantic versioning follows certain rules while determining the current version number
    • The core of Semantic versioning system/rule:MAJOR.MINOR.PATCH 1.0.0
  • Many Software Development companies worldwide and software giant like Google decided and declared that their frameworks and tools version will be upgraded as perSemantic Versioning System

  • SemVer or Semantic Versioning or Semantic Versioning System has 3 main components as = x.x.x i.e. Major.Minor.Fix Patch version/release, example: 0.0.1

    • Fix Patch - can increase any time with bug fixes/patch release| Bug fixes, simple changes| Some bugs were fixed and code works fine.1.0.1

    • Minor version - increases with every feature release which does not break any functionalities| Adding/changing new/old feature which does not break existing functionality in application| Some new features added and code works fine1.1.0

    • Major version - Break in the functionalities, extraordinary feature achievements| Totally new/fresh features which extra ordinary breaking changes| Big changes & new functionalities added and code works fine2.0.0

  • SemVer or Semantic Versioning symbols:

    • ^ caret sign = upgrade if change in Minor/Patch version like 1.x.x

    • ~ tilde/tilda sign = upgrade if change in Patch version like 1.0.x

website: semver.org |https://semver.org/

3.5. package json Defaults

3.5. package json Default values

  • To set desired default values in package.json

    • commandnpm config set init-author-name "Dinanath Jayaswal"
    • ORnpm set init-license "MIT"
  • To get default values of package.json

    • commandnpm config get init-author-name
    • ORnpm get init-license
  • To unset any default values set in package.json

    • commandnpm config delete init-author-name
    • ORnpm delete init-license

   

Package.json set get default values

    Image - 3.5.1 - Package.json set get default values

Syntax & Example:3.5-package-json-set-default-values/package.json

{"name":"3.5-package-json-set-default-values","version":"1.0.0","description":"","main":"index.js","scripts": {"test":"echo\"Error: no test specified\" && exit 1"  },"keywords": [],"author":"Dinanath Jayaswal","license":"ISC"}

   

Package.json with default values set

    Image - 3.5.2 - Package.json with default values set

4 Installation of the NPM packages

4 Dealing with NPM packages NPM Registry

  • NPM allows/helps developers to publish their solution(s) code/package/module intoNPM Registry so that other developers facing the same issue can re-use the code by installing the required NPM package/module
  • All packages live/exist in an online NPM registry
  • One can just visit (website:https://www.npmjs.com/) and simplysearch for required solution/package/module

4.1. Popular famous NPM Packages

Here is the list of various commonly used, popular and famous npm packages available:

Package/ModuleDescription
expressHTTP helpers web framework for node
command to install:npm install express
body-parserBody parsing middleware
nodemonUtility to monitor any changes in source code and reload the application automatically (restart/reloads application/server if any changes done by the developer).
babel-coreCompile/Transpile ES6 code to ES5 code
lodashMakes working with JavaScript easier
reactHelps to create ReactJs applications
requestHelps in making HTTP calls most easily/most quickly
asyncHelps to work with async JavaScript applications
momentParse, validate, manipulate and display dates
angular/cliGenerating and serving an Angular project via a development server

   

Popular Famous NPM Packages: Moment

    Image - 4.4.1 - Popular Famous NPM Packages: Moment

4.2. More on NPM Packages

4.2. Local and Global Packages

The package is nothing but just acollection of code ready to use, it is usually managed and maintained with a package management system.

Sometimes word Package is alternatively used in place of Module. Package/Module is nothing but a single or bunch of reusable code file(s) wrapped together with a special file namedPackage.json.

Packages are categorized undertwo different categories depending on their mode of installation done by developer:

  1. Local Packages
  2. Global Packages

1. Local Packages

  • Local Packages areinstalled within the current project/application directory where one will be executing thenpm install command and will be accessible byonly current project/application
  • If any package required or makes senseonly to a specific project/application than it is advisable to install the package locally in the current project folder

Syntax:npm install <package_name> ORnpm i <package_name>

Example:npm install moment

2. Global Packages

  • Global Packages are installed at a single/central place (path environment variables) in your system and they can be used byany of the projects present in your system
  • Some packages are commonly used in multiple angular/node projects/application in such scenarios its advisable to install those packages globally so that its available underpath environment variables
  • Globally installed dependencies are not part of/not residing inpackage.json and/ornode_modules
  • We can use the-g flag to install the package globally

Syntax:npm install <package_name> -g ORnpm i <package_name> -g

Example:npm install moment -g

4.3. Installing Local Packages

4.3. Installing Node-NPM Package Locally

  • If any package required or makes senseonly to a specific project/application than it is advisable to install the package locally in the current project folder
  • At npm official website:https://www.npmjs.com/ we can search for the specifically required package and have all help/detailed information of the package
  • To install any third-party library or npm package in Node application use command:npm install <package_name> ORnpm i <package_name> (it download and install packages also makes/add an entry in package.json file)
  • All packages/modules and dependencies mentioned inpackage.json get installed under the foldernode_modules

Syntax:npm install <package_name> ORnpm i <package_name>

Example:npm install moment

   

Installing local package: npm install <package_name>

    Image - 4.3.1.1 - Installing local package: npm install

   

Installing local package: package.json <package_name>

    Image - 4.3.1.2 - Installing local package: package.json

Syntax & Example:4.3.1-Installing Local Packages-npm-i/package.json

{"name":"npm-local-package-installation","version":"1.0.0","description":"Learn to install npm packages locally","main":"index.js","scripts": {"test":"echo\"Error: no test specified\" && exit 1"  },"keywords": ["npm","node","local","package","npm","install"  ],"author":"Dinanath Jayaswal","license":"MIT","dependencies": {"moment":"^2.24.0"  }}

   

Installing local package: folder structure

    Image - 4.3.1.3 - Installing local package: folder structure


  • As per the recent NPM version, whatever npm package we install with commandnpm i <package_name> thepackage.json by default take a record/an entry of the same as dependencies (in old/past version we use to provide--save flag-likenpm i <package_name> --save)
  • To save the package/module in a package.json as a dependency for current project, we must have to use following command:

Syntax:npm install <pakcage_name> --save ORnpm i <pakcage_name> --save

Example:npm install moment --save


  • Development or Developer dependency based package must be part of devDependency in package.json (packages needed for develpoment and are not required for production)

Syntax:npm install <pakcage_name> --save-dev ORnpm i <pakcage_name> --save-dev

Example:npm install @angular/cli --save-dev

   

Installing local package: npm install <package_name> --save-dev

    Image - 4.3.1.4 - Installing local package: npm install --save-dev

   

Installing local package: package.json <package_name> with dev dependency

    Image - 4.3.1.5 - Installing local package: package.json with dev dependency

Syntax & Example:4.3.1-Installing Local Packages-npm-i/package.json

{"name":"npm-local-package-installation","version":"1.0.0","description":"Learn to install npm packages locally","main":"index.js","scripts": {"test":"echo\"Error: no test specified\" && exit 1"  },"keywords": ["npm","node","local","package","npm","install"  ],"author":"Dinanath Jayaswal","license":"MIT","dependencies": {"moment":"^2.24.0"  },"devDependencies": {"@angular/cli":"^8.3.23"  }}

   

Installing local package: folder structure with multiple packages

    Image - 4.3.1.6 - Installing local package: folder structure with multiple packages

4.3.1. Installing Specific Version of a Package

Sometimes we need to upgrade or downgrade to the specific version of a particular package. To install/setup a specific version use following command:

Syntax:npm install <package_name>@version

Example:npm install underscore@1.9.2

4.4. Uninstalling Local Packages

Sometimes we need to uninstall some unwanted and deprecated packages from current project/application with commandnpm uninstall <package_name>. As and when we uninstall some package, its entry gets deleted frompackage.json file andnode_module folder.

Syntax:npm uninstall <package_name> OR npm un <package_name>

Example:npm uninstall moment

  • To remove the entry of deleted packages from package.json file (if required)

Syntax:npm uninstall <pakcage_name> --save ORnpm un <package_name> --save

Example:npm uninstall <pakcage_name> --save

  • Uninstall/delete dev dependencies if any:

Syntax:npm uninstall <pakcage_name> --save-dev ORnpm un<pakcage_name> --save-dev

Example:npm uninstall @angular/cli --save-dev

4.5. Installing Global Packages

  • Global Packages are installed at a single/central place (path environment variables) folder in your system and they can be used byany of the projects present in your system
  • Some npm packages are commonly used in multiple angular/node projects/applications, in such scenario, it is advisable to install those packages globally so that its available underpath environment variables
  • Globally installed dependencies are not part of/not residing inpackage.json and/ornode_modules
  • We can use-g flag withnpm install command to install a package globally

Syntax:npm install <package_name> -g ORnpm i <package_name> -g

Example:npm install moment -g

  • To get a list of global outdated packages command:npm outdated -g

4.6. Uninstalling Global Packages

  • To uninstall global packages we can use following command:

Syntax:npm uninstall <package_name> -g ORnpm un <package_name> -g

Example:npm uninstall moment -g ORnpm un moment -g

  • NPMremove command is also used to uninstall global packages:

Syntax:npm remove <package_name> -g ORnpm rm <package_name> -g

Example:npm remove moment -g ORnpm rm moment -g

4.7. Listing the Installed Packages

  • To get the list of dependencies/packages installed in the application, one can have a manually look inpackage.json file or check-innode_modules folder but these processes are pretty time consuming, so its advisable to usenpm list command
  • npm list command displays the tree-like structure of packages locally installed

npm list: To get list/tree of all installed dependencies (Tree of main as well as sub dependencies)

   

NPM List

    Image - 4.7.1.1 - NPM List

npm list --depth=0 ORnpm list --depth 0: Get the list of main dependencies only (No sub dependencies)

   

NPM List Depth 0 : npm list --depth=0

    Image - 4.7.1.2 - NPM List Depth 0 : npm list --depth=0

npm list --depth=1 ORnpm list --depth 1 : Show package with only one ie. 1st level of dependency

   

NPM List Depth 1 : npm list --depth=1

    Image - 4.7.1.3 - NPM List Depth 1 : npm list --depth=1

  • To get list of global packages:

npm list --global true --depth 0: Show list of Global packages with main dependencies only (No sub dependencies)

   

NPM List Depth 0 : npm list --global true --depth 0

    Image - 4.7.1.4 - NPM List Global Depth 0 : npm list --global true --depth 0

4.8. Installing from package json

4.8. Using readymade package json

4.8. Setup Project Development environment with existing package json

  • Many times other developers share their application metadata and dependencies information in the form ofpackage.json which helps to set up the development/project environment
  • It is advisable to share onlypackage.json file with other developers/team members or external world (No need to sharenode_modules folder)
  • One can simply run an npm command:npm install to download/install all required dependencies locally as mentioned inpackage.json file
  • npm install - command is one of the most widely used and common commands of node/npm
  • It first createsnode_modules folder and installs all the packages with listed dependencies mentioned in package.json

4.9. Updating Packages

It is important to update packages from time to time basis so that we make the best use of new features/utilities that are available/introduced with every release.

In the actual development world, there might be a newer version of the package/dependency with which we are working and installed in the project.

4.9.1. NPM Outdated


  • To find out the outdated packages/dependencies and to get the details of current and latest versions in tabular form

Syntax:npm outdated

Example:npm outdated

   

NPM outdated list

    Image - 4.9.1 - NPM outdated list

4.9.2. Updating Local Packages


  • To update all packages

Syntax:npm update

Example:npm update

  • To update specific package

Syntax:npm update <package_name>

Example:npm update moment

4.9.3. Updating Global Packages


  • To update all global packages

Syntax:npm update -g

Example:npm update -g

  • To update specific global package

Syntax:npm update <package_name> -g

Example:npm update @angular/cli -g

  • To update npm itself

Example:npm install npm@latest -g

4.9.4. Updating Saving Dependencies


  • To update and save all dependencies in package.json:

Syntax:npm update <package_name> --save

Example:npm update moment --save

  • To update and save all dev dependencies in package.json:

Syntax:npm update --dev --save-dev

Example:npm update --dev --save-dev

4.9.5. Updating Latest Major release


  • Note: The commandnpm update, updates packages to the only Minor/Patch release (Usually, we use^ caret sign which denotes minor/patch release only)
  • To check and install the latest Major release we can need to use/install another npm package namednpm-check-updates ORncu
    • To installnpm-check-updatesuse command:npm install npm-check-updates -g
  • Oncencu installed, run command:npm-check-updates ORncu to get the list of all latest updated version of packages
  • Run command:ncu -u to upgrade package.json file with latest versions of packages
  • Finally run the command:npm install to install all updated packages from package.json

4.10. NPM Prune

4.10. Remove Unused Extraneous Packages

Thenpm list command shows up a list ofunused, unwanted, extraneous packages installed just for R&D or testing purposes and also installed by mistake.

  • To remove/delete/uninstall and clean such extraneous/unwanted packages we must need to use command:

Syntax:npm prune ORnpm prune <package_name>

Example:npm prune

This command removes such extraneous packages. If a package name is provided, then only packages matching one of the supplied names are removed.

4.11. Viewing Registry Info for a Package

4.11. Package Metadata Details Info

To learn some npm package or get more detailed information about a package, one is supposed to visit/head over to (website:https://www.npmjs.com/), search for the package, read technical metadata information in the form of (use case, versions, dependencies, etc.)

The quickest, fastest and advisable way to get metadata details is to use npm commands as given below:

  • Get all info/metadata or package.json file of specific/particular<package_name> with all dependencies

Syntax:npm view <package_name>

Example:npm view underscore

  • To get the list of only dependencies for<package_name>

Syntax:npm view <package_name> dependencies

Example:npm view @angular/cli dependencies

  • To get the released version of a package

Syntax:npm view <package_name> version

Example:npm view underscore version

  • To get the all released versions of a package

Syntax:npm view <package_name> versions

Example:npm view underscore versions

   

Package Metadata Details Info

    Image - 4.11.1 - Package Metadata Details Info

   

Package Metadata Dependencies Details Info

    Image - 4.11.2 - Package Metadata Dependencies Details Info

   

Package Metadata Versions Details Info

    Image - 4.11.3 - Package Metadata Versions Details Info

5 Using a Extermal Package

5 Using a Extermal Third Party Package

  1. Visit the website:https://www.npmjs.com
    • At npm official website:https://www.npmjs.com/ we can search for the specifically required package and have all help/detailed information of the package
  2. Search for any popular npm package/library likeunderscore website:https://underscorejs.org/ (its a utility for widely used for JavaScript functions, JavaScript's functional programming helper library.)
  3. Installunderscore by using npm command:npm i underscore, (now a days as per the latest node/npm versions, we no longer need to specify--save flag (an entry in package.json andnode_modules done automatically/by default))
  4. Create a new entry point file at the root of the package namedindex.js
    • Include/load underscore package/module: var _ = require('underscore');
    • Firstpackage_name ie. underscore is searched in node core module than locally as files/folders and/or then in 'node_modules' folder
  5. Check exact usability and use-cases of 'underscore' at website/help and use accordinglyunderscore functions
  6. Check the files output by using node command:node index.js

Syntax & Example:5-using-external-third-party-package/package.json

{"name":"using-external-thir-party-package","version":"1.0.0","description":"Learn using-external-thir-party-package","main":"index.js","scripts": {"test":"echo\"Error: no test specified\" && exit 1"  },"keywords": ["using-external-thir-party-package"  ],"author":"Dinanath Jayaswal","license":"MIT","dependencies": {"underscore":"^1.9.2"  }}

Syntax & Example:5-using-external-third-party-package/index.js

// include/load underscore libraryvar_=require('underscore');// use underscore libraryvarisContains=_.contains(['hi','hello','hey','hola'],'hello');console.log('It contains hello:',isContains);

   

Using a Extermal Third Party Package: Folder Structure

    Image - 5.1 - Using a Extermal Third Party Package: Folder Structure

   

Using a Extermal Third Party Package: Node Output

    Image - 5.2 - Using a Extermal Third Party Package: Node Output

6 Package Dependencies

6 Package Dependency Management

Code/program/Instructions that another set of Code/program depends on to function (Like We use particuler set of code in our app, it is a dependency - our app depends on it. It may be possible that current code depends on some other code and have some other dependencies).

There are two types of dependencies:

  1. Application/project dependencies
  2. Dev dependencies

6.1. Application Dependencies


The dependencies are essential for running the application, basic common packages need every-time.

  • The commandnpm i <package_name> will create one entry inpackage.json file and all required dependencies get installed undernode_modules folder
    • Command:npm install <package_name>
  • In the past/previous npm version, all dependencies use to install insidefolder->folder->folder etc., but now as per latest node/npm - all dependencies are getting installedat the root node_modules folder to avoid deeply nested long path, characters limitations in file/folder naming convention

6.2. Dev Dependencies


Global dependencies:npm install <package_name> -g, it is installed in common program files folder

  • Development dependencies like unit testing tools/packages, static analysis based packages, code bundling tools are not supposed to go to the production environment where we deploy the applications
  • Use/Supply--save-dev flag to save provided package under dev dependencies (devDependencies) section of package.json file
    • npm install <package_name> --save-dev

Note: All dependencies are getting installed under node_modules folder but segregated only in package.json file asdependencies & devDependencies.

Global dependencies:npm install <package_name> -g, it is installed in common program files folderpath environment variables

7 NPM Packages and Source Control

  • It is advisable not to Share as well as check-innode_modules folder in git or any other Version Control System/Revision Control/SCM/SVC/SVN tools
- SCM - Software Configuration Management    - SCM - Source Control Management Tool- VCS - Version Control System- SVC - Software Version Control- SVN - Subversion (Software Version)

7.1. Ignore node_modules folder

How to ignore/exclude node_modules folder with git


  • Create a.gitignore file in the local git repository folder
  • List down all the files/folder which we want to ignore while check-in/check-out code

.gitignore

node_modules/

8 NPM Scripts

Scripts section of package.json file run by default, it is very handy when you want to execute/run/initiate some custom tasks from package.json.

Scripts section consists of custom command or scripts to use in application i.e.npm test ornpm build ornpm serve ornpm start etc. Heretest, build, serve, start is a custom script that executes default tasks/activities as per logic/requirements.

8.1. Creating and running custom script

  1. Create a package.json with the command:npm init -y
  2. Change/replace the existing scripts
"scripts": {"test":"echo\"Error: no test specified\" && exit 1" },

To

"scripts": {"start":"node app.js" },
  1. Create a new .js file named asapp.js, write some statements with console.log
  2. Run commandnpm start to initiate application and get output at terminal console

Syntax & Example:package.json

{"name":"8.1-creating-runnning-npm-script","version":"1.0.0","description":"","main":"index.js","scripts": {"start":"node app.js"  },"keywords": [],"author":"Dinanath Jayaswal","license":"ISC"}

Syntax & Example:app.js

console.log('NPM start... app.js running');

   

Creating Running custom script Folder structure

    Image - 8.1.1 - Creating Running custom script Folder structure

   

Running custom script output

    Image - 8.1.2 - Running custom script output

9 Creating and Publishing a Package to NPM Registry

9.1. Creating a New Package

  • Create a new directory on local to store new library/package, command:mkdir maths-lib
  • Change directory to explore inside, command:cd maths-lib
  • Create/Instantiate new package.json file, command:npm init -y ornpm init --yes
  • Create a new file namedindex.js as the entry of package, create and export some function as per logic and requirements of the package

9.2. Publishing a Package

To Publish a package to online NPM registry, the developer should have User Credentials:

  • Create an account/register/sign-up athttps://www.npmjs.com/
    • by visiting in a browser or
    • at the command prompt using the command:npm adduser
  • If a user already exists than sign-in by using the command:npm login and enter credentials with the email address
  • To publish a package use command:npm publish (if any error related to package name pops-up, change the name in package.json with some unique identifier as"name":maths-lib-1 or so...)

9.3. Using a Published Package

  • To check/verify/install and usemaths-lib-1 package, create a new folder for fresh application and try to install package with command:npm install maths-lib-1
  • To use/call/load previously createdmaths-lib-1 package/module in new appliacation, create a newindex.js file andimport/load maths-lib-1 package with 'require('maths-lib-1')', try to call its methods
  • execute file with command:node <file-name> ornode index.js

9.4. Updating a Published Package

  • Make necessary changes in any .js file of the previously created package by adding and exporting some more functions/logic
  • change version manually in package.json file or run the command:
    • npm version major OR
    • npm version minor OR
    • npm version patch
  • To publish edited package command:npm publish
  • Go to other application and run update old package to new version command:npm update
  • Now in any .js file try to call latest methods
  • execute file with command:node <file-name>

Syntax & Example:9-creating-publishing-package/maths-lib/index.js

module.exports.add=function(num1,num2){returnnum1+num2;}module.exports.subtract=function(num1,num2){returnnum1-num2;}module.exports.multiply=function(num1,num2){returnnum1*num2;}module.exports.divide=function(num1,num2){returnnum1/num2;}module.exports.oddEven=function(num1){if(num1%2===0){return'Even Number';}else{return'Odd Number';}}

Syntax & Example:9-creating-publishing-package/using-published-package/index.js

varmathsLib=require('maths-lib-1');varadd=mathsLib.add(10,20);console.log(add);varoddEvenNumber=mathsLib.oddEven(39);console.log(oddEvenNumber);

   

Search published package at npm registry

    Image - 9.1.1 - Search published package at npm registry

   

Details of published package at npm registry

    Image - 9.1.2 - Details of published package at npm registry

10 NPM Resources

10.1. Websites Reference Links


Reference: -https://nodejs.org

Reference: -https://www.npmjs.com/

10.2. NPM command Shortcuts


Table: NPM command Shortcuts

Node-NPM commandDescription
npm init-ySkips questions and creates package.json with default values)
npmi <package_name>Install
npm i <package_name>-SSave package as Dependency in package.json
npm i <package_name>-DSave package asdevDependency in package.json
-gGlobal
npm-vVersion

Reference: -https://docs.npmjs.com/misc/config

10.3. Commonly Widely used Node-NPM commands


Table: Widely used Node-NPM commands

Node-NPM commandDescription
node -v ORnode --versionTo get Node Version
npm -v ORnpm --versionTo NPM Node Version
npm install -g @angular/cliTo install Angular CLI globally
npm -h ORnpm -help ORnpm --helpTo get help on any node/npm command
npm install <package_name> ORnpm i <package_name>To Install Node-NPM Package

About

Lets learn-understand-practice and master the basics of NPM-Node-Package-Manager. Will explain and cover what why and how to use NPM - Node Package Manager. This Node-NPM Tutorial will help/ease in understanding the basic building, needs and fundamentals of NPM and ultimately give a head start in Nodejs.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

[8]ページ先頭

©2009-2025 Movatter.jp