NPM
Introduction | |
Install | |
First Steps | |
Packet Installation | |
Install Specific Version | |
Common Errors | |
Related Articles |
Introduction
Installation
It is part of Nodejs, so it does not require a separate installation.
Read about installing Nodejs in the article
Install Nodejs
Check Version
You can check the versions of installed Nodejs, npm and npx with the following commands
$ node --version
v10.16.3
$ npm --version
6.9.0
$ npx --version
6.9.0
First Steps
It is logical to start by creating a directory for a new project.
I will be working on the website
HeiHei.ru
therefore, I will call the folder heihei
mkdir heihei
Go to the created directory
cd heihei
Make sure that the new folder is empty
ls
Now we will execute the most important command for future development
$ npm init
This utility will walk you through creating a package.json file.
It only covers the most common items, and tries to guess sensible defaults.
See `npm help json` for definitive documentation on these fields
and exactly what they do.
Use `npm install <pkg>` afterwards to install a package and
save it as a dependency in the package.json file.
Press ^C at any time to quit.
package name: (my-project)
npm will offer to fill in the information about the project. The following fields will appear:
name: (heihei)
version: (1.0.0)
description:
entry point: (index.js)
test command:
git repository:
keywords:
author:
license: (ISC)
You can fill in all the fields, but for simplicity, for now, just press Enter several times in a row
If you first bind the directory to a remote repository
GIT
then npm will see it during initialization and fill in the git repository item itself.
Perhaps this is the easiest and right way if you plan to continue working with GIT.
A similar message should appear at the end. Press Enter again.
About to write to C:\Users\ao\Desktop\Sites\heihei\package.json:
{
"name": "heihei",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC"
}
Is this OK? (yes)
Let's check what appeared in our folder after initialization
ls
package.json
package.json
this is a file that will store a list of installed packages and their versions.
Immediately after initialization, it contains only information about the project
{
"name": "heihei",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC"
}
Installation пакетов
Установим первый пакет. Начнём с jquery.
npm install jquery
npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN heihei@1.0.0 No description
npm WARN heihei@1.0.0 No repository field.
+ jquery@3.4.1
added 1 package from 1 contributor and audited 1 package in 1.227s
found 0 vulnerabilities
In versions of NPM lower than 5.0.0, when installing packages, there was no automatic writing to the package file.json
In order to update the package.json had to be installed with the --save option
For example: npm install jquery --save
In new versions, this happens automatically, but --save is still used to specify exactly how to install
the package.
A popular option is --save-dev which allows you to make an installation, so to speak, for "development and testing";
I will analyze an example of such an installation in the article Gulp
You can read more
здесь,
docs.npmjs.com/cli/install
Check what was created in our folder after installing the first package
ls
node_modules/ package.json package-lock.json
The
package-lock.json
file appeared in the fifth version of NPM as an additional means of compatibility control.
Especially for cases when the package file.the json was copied and after a while
initialization was performed with it (npm init), but during this time some of the packages managed to get a new version.
You can read more about this
here,
here,
here
You can read about version control on the website
semver.org
Let's look at the contents of the package-lock file.json
{
"name": "heihei",
"version": "1.0.0",
"lockfileVersion": 1,
"requires": true,
"dependencies": {
"jquery": {
"version": "3.4.1",
"resolved": "https://registry.npmjs.org/jquery/-/jquery-3.4.1.tgz",
"integrity":
"sha512-36+XXXX
XXXXXXXXXXXXXXX
XXXXXXXXXXXXXXX
XXXXXXXXXXXXGoB
d+tHdrBMiyjGQs0
Hxs/MLZTu/eHNJJuWPw=="
}
}
}
Let's see what is in the node_modules folder. After installing jquery, it would be logical to see the jquery folder there
$ ls node_modules/
jquery/
In this case, everything is obvious, but a huge number of packages will create not one folder, but several at once.
Older versions of npm always created one folder and placed all dependencies there.
Newer versions of npm retain dependencies in node_modules.
Let's see what's in the folder node_modules/jquery.
$ ls node_modules/jquery/
AUTHORS.txt bower.json dist/ external/ LICENSE.txt package.json README.md src/
As you can see, jquery has its own package file.json at this stage, it is much more substantial than our root package.json but it's not for long.
Install Specific Version
Let's install another package and talk about its possible versions
$ npm install normalize.css
If
package.json
does not contain a record about normalize.css, then the latest stable version will be installed.
If in package.the json version is specified, it will be installed.
If you want to install a specific version, specify it in the package.json or
enter @version number during installation.
For example npm install normalize.css@8.0.1
npm WARN heihei@1.0.0 No description
npm WARN heihei@1.0.0 No repository field.
+ normalize.css@8.0.1
added 1 package and audited 2 packages in 0.523s
found 0 vulnerabilities
$ vi package.json
{
"name": "heihei",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"dependencies": {
"jquery": "^3.4.1",
"normalize.css": "^8.0.1"
}
}
There are a lot of npm packages. To study them all - register on the website
www.npmjs.com
Convenience of the package file.json is that if you want to copy
Your project - it is enough to transfer the package file.json and execute the npm init command.
All packages listed in package.json will be installed with the specified versions.
Errors
Gulp | |
Concat multiple css to one | |
Send files via ftp with Gulp | |
Gulp series | |
Process only changed files with gulp.watch().on('change') | |
Copy Directory Gulp | |
Video Tutorials | |
JavaScript | |
NodeJS | |
NPM | |
Web |