What is the NPM Series? A Brief Introduction to NPM

NPM is the package management tool of Node.js. The birth of NPM also greatly promotes the development of front-end.

This article is the first in the NPM series, and it’s a very basic, warm-up article that you can skip if you’re already a development journeyman.

1. The installation of NPM

NPM is based on Node.js, so we need to install node.js in two ways:

  1. Node. Js site
  2. NVM (suggested) specific articles can be searched under

2. Use

2.1 How Do I Update the NPM

// Check the NPM version NPM -v // Update NPM NPM install npm@latest -gCopy the code

2.2 Installation Dependencies

In practice we install both local packages (project dependencies) and global packages (command-line tools).

  1. How do I manage local packages

To install a package, use the following command:

npm install <package_name>
Copy the code

A package can be removed using the following command:

npm uninstall <package_name>
Copy the code

When you install packages in your project, they are installed in Dependencies by default. You can control this behavior with the following parameters:

  • -p, –save-prod: Record independenciesIn the
  • -d, –save-dev: records indevDependenciesIn the
  • -o, –save-optional: Record inoptionalDependenciesIn the
  • –no-save: will not be recorded independenciesIn the

There are two additional parameters:

  • -e, –save-exact: Version number will not be recorded semantically, it will show the specific “1.2.3”
  • -b, –save-bundle: dependencies are also logged inbundleDependenciesIn the

To remove dependencies from the package.json file, add an argument to the command:

NPM uninstall --save lodash // When the package is installed through --save-dev, specify --save-dev to uninstall it. NPM uninstall --save-dev webpackCopy the code
  1. How do I install the global package

The global installation is used to install command line tools such as gulp and http-server. We just need to add -g to the end. For example:

npm install -g http-server
Copy the code

Sometimes we can’t remember a package and what command should we use to see all the installed packages:

NPM list -g --depth 0 NPM list -g --depth 0Copy the code

2.3 package – lock. Json

A package-locking. json file is automatically generated when a dependency is installed in a project. This file contains the dependency information of the installation.

3. dependencies

I mentioned the concept of dependencies earlier, but what are the dependencies in NPM?

  • Dependencies Production Environment
  • DevDependencies The development environment
  • OptionalDependencies optionalDependencies
  • PeerDependencies Front dependency
  • BundleDependencies (bundleDependencies)

3.1 dependencies && devDependencies

These are the two we use the most, and the two that need the most attention.

If we have a magic- Lint plugin that checks and formats code for commit, there’s at least an prettier plugin for prettier, so we need to make sure it works for other users. “Prettier” lists prettier as “dependencies”.

In addition, we need jEST to test in the development environment of Magic-Lint. In addition, we need jest to test in the development environment of Magic-Lint. In addition, we need jest to test in the development environment of Magic Lint.

If the –production tag is added, or the environment variable NODE_ENV is set to production, NPM will not install modules in devDependencies.

3.2 peerDependencies

So when do YOU use peerDependencies?

Let’s say we have a webpack-plugin-God that is just a plug-in for WebPack, and does not depend on WebPack, so we don’t mention webpack in dependencies or devDependencies. In fact, it is developing for a specific version of WebPack, so you can write WebPack in peerDependencies.

3.3 optionalDependencies

If there is a package that is available or not, we can refer to it as optionalDependencies

We can use optional packages when writing code like this:

try {
  var foo = require('foo')
  var fooVersion = require('foo/package.json').version
} catch (er) {
  foo = null
}
if ( notGoodFooVersion(fooVersion) ) {
  foo = null
}

// .. then later in your program ..

if (foo) {
  foo.doFooThings()
}
Copy the code

3.4 bundleDependencies

Let’s say we have a package.json:

{
  "name": "awesome-web-framework"."version": "1.0.0"."bundledDependencies": [
    "renderized"."super-streams"]}Copy the code

With the NPM pack command we can get the file awesome- Web-Framework-1.0.0. TGZ, which contains renderized and Super-Streams dependencies.

NPM install awesome- Web – Framework -1.0.0.tgz

├── node_modules.├ ── web-Framework │ ├── Renderized │ ├─ super-Copy the code

4. The forecast

The next article will explain NPM install, after looking at it, I hope to be able to let you say: “wow ~ can also do this”, I am satisfied.

Series of summary

  • What is the NPM series
  • What is the NPM series: two, install eighteen martial arts
  • to be continued