search
HomeWeb Front-endJS TutorialOne article to learn about the package management tool in Node.js - npm

One article to learn about the package management tool in Node.js - npm

Aug 08, 2022 pm 07:51 PM
nodejsnodenpmPackage management tools

npm is the package management tool for Node.js. The following article will give you an in-depth understanding of the Node package management tool-npm. I hope it will be helpful to you!

One article to learn about the package management tool in Node.js - npm

1. Overview of npm

npm (Node Package Manager) is the package management tool for Node.js.

What is a package? A package is a piece of code, a third-party module of Node.js.

For example: JQuery module, Bootstrap module

npm is a command, installed together with Node.js. In other words, when we install Node.js, it will be installed together with an npm package management tool.

2. Test whether npm is installed successfully

1. Shortcut key win r to open the command prompt, or open a black window in the VScode terminal.

2. Enter the npm --version command or the abbreviated command npm -v. When the npm version number as shown below appears, the installation is successful.

3. Package dependencies

npm can download (install) packages and package dependencies. For example, as shown below: The Bootstrap package depends on JQuery, so downloading the BootStrap package will download the JQuery package together. It is equivalent to the common saying we usually say: which came first, the chicken or the egg. So our package also has JQuery first, and then Bootstrap. If you want to install Bootstrap, it will install the dependent package JQuery together.

4. Package installation method

1. Traditional manual download: For example, if we want to download Bootstrap, then we first Find the official website of this framework, enter it, find the appropriate version resource, and download it. It may take a long time for some people to find the website and download it, because some people may not remember which official website it is, and they still need to search it. After finding it, they still need to find the appropriate resource to download. Such tedious operations are our traditional method downloaded.

2. Install through the npm package management tool. This package contains many packages used by the front end. You can search for any package on the http://npmjs.com website for us to download and install. After we learn about npm packages, we can install these packages with one command. We no longer need to find the official website of the package to download. Installation can be achieved by npm install the name of the package.

5. npm mirror source

The npm mirror source is the resource address of the Node.js package managed by npm.

http://npmjs.com

6. npm downloads the package from the mirror source

npm downloads the package from the mirror source when we enter npm install package name, after this command, he will go to the official website http://npmjs.com to find, download and install the package for our developers to use.

For example, if we want to download the JQuery package, then we only need to type a command npm install JQuery in the black window.

npm download analogy app store

7. Modify npm mirror source

Our npm mirror source is a foreign website. We need to install a package and go abroad to install it. It is a waste of our time, so we have to install it abroad. As for the npm image source, we can change it to our domestic image source through commands, so that we can install it quickly and improve our efficiency.

Command to modify the npm image source: npm config set registry https://registry.npm.taobao.org

Check whether the modification is successful. Command: npm config get registry

Example:

8. Use npm to install the package

Use the installation command: npm install

9. How to install npm packages

##9.1 Global installation

The so-called global installation is to use the package as a global command.

Installation command: npm install --global

Installation command abbreviation: npm i -g

Global installation installation steps

1. Clarify your needs; 2. Find the appropriate package; 3. Install the package through npm; 4. Use the package;

Example: Installation of minify compressed package

Installation command: npm install minify -global

Installation command abbreviation: npm i minify - g

Command to compress files: minify The path of the file to be compressed> The path of the file to be stored after compression

For example: the following case: minify ./style.css > ./style. min.css

Explanation: Compress the style.css file in the current directory, then compress it to the current directory, and change the file name to style.min.css

Resolution: The file C:\Users\user\AppData\Roaming\npm\npx.ps1 cannot be loaded because running scripts is prohibited on this system.

1. Click the Windows key, or click the button in the lower left corner of the screen to open powerShell as an administrator

2. Enter the command: set-ExecutionPolicy RemoteSigned and press Enter;

Then enter

Y and press Enter;

Then we enter the command That’s it.

  • Command to uninstall the package:

    npm uninstall minify -global

  • Uninstall The abbreviated command of the package:

    npm uni minify -g

Example: After testing to uninstall the package and then execute the compression command, you will find an error.

##9.2 Project (partial) installation The so-called project (partial) installation is the package Only used in the current project.

Project installation steps

1. Create the project directory (mkdir project);

2. Enter the project Directory (cd project);

--------------------------Note: You can create it yourself in the above 2 steps. No command required-----------------------------------------

3. Initialize the project (npm init);

4. Install the package in the project;

Example: Result of executing the initialization command

You will find that there is an additional package.json file in our directory

    In the project, follow the package command:
  • npm install --save

  • In the project According to the command abbreviation of the package:
  • npm i -S

  • After we install it through the command, we can use the global method just now When compressing, an error message will be prompted. Of course, we should pay attention here:

We must uninstall the package uninstalll installed in the global way we just tested before the following error will appear.

The reason for the error is: because we changed the global to the current project (local installation), so if we want to use the compression command, we need to find the minify Bag.

After we enter the command npm i -S, there will be an additional node_modules directory, and below it, we have a .bin directory, and under the .bin directory there is A minify package, we found it now.

So we have found this package, how to write the compression command?

Use the command of the project installation package: ./node_modules/.bin/minify File path> Compressed file path

For example: ./node_modules/.bin/minify .\style.css > .\style.min.css

By seeing the following picture to test, we have compressed the file.

<span style="font-size: 18px;">##--save-dev<strong></strong></span>Command

Command:

npm install --save-dev

Command abbreviation:

npm i -D

Npm installation command parameters

<span style="font-size: 18px;">- The difference between -save<strong></strong></span> and --save-dev##- -save: Installed packages. You need to carry installed packages during development and online, such as JQuery, Vue, and Bootstrap packages. Because these packages are style layout packages, we need to carry them when going online.

--save-dev: The installed package will only be used in the development environment and will not be used after going online. Then use this command, such as minify compressed file package

How to check whether it was installed with --save or --save-dev? After we install the package, a dependency will be generated in package.json. If it is installed with -S, it will be under dependencies. If it is installed with -D, it will be under dependencies. under devDependencies. When we uninstall the package in the future, the dependencies here will disappear. So we can see the packages we depend on by looking at package.json.

Summary of how to install npm packages

# #Supplement:

In the currently entered directory, open the vscode editor command: code . (dot)

For more node-related knowledge, please visit :

nodejs tutorial
!

The above is the detailed content of One article to learn about the package management tool in Node.js - npm. For more information, please follow other related articles on the PHP Chinese website!

Statement
This article is reproduced at:csdn. If there is any infringement, please contact admin@php.cn delete
JavaScript in Action: Real-World Examples and ProjectsJavaScript in Action: Real-World Examples and ProjectsApr 19, 2025 am 12:13 AM

JavaScript's application in the real world includes front-end and back-end development. 1) Display front-end applications by building a TODO list application, involving DOM operations and event processing. 2) Build RESTfulAPI through Node.js and Express to demonstrate back-end applications.

JavaScript and the Web: Core Functionality and Use CasesJavaScript and the Web: Core Functionality and Use CasesApr 18, 2025 am 12:19 AM

The main uses of JavaScript in web development include client interaction, form verification and asynchronous communication. 1) Dynamic content update and user interaction through DOM operations; 2) Client verification is carried out before the user submits data to improve the user experience; 3) Refreshless communication with the server is achieved through AJAX technology.

Understanding the JavaScript Engine: Implementation DetailsUnderstanding the JavaScript Engine: Implementation DetailsApr 17, 2025 am 12:05 AM

Understanding how JavaScript engine works internally is important to developers because it helps write more efficient code and understand performance bottlenecks and optimization strategies. 1) The engine's workflow includes three stages: parsing, compiling and execution; 2) During the execution process, the engine will perform dynamic optimization, such as inline cache and hidden classes; 3) Best practices include avoiding global variables, optimizing loops, using const and lets, and avoiding excessive use of closures.

Python vs. JavaScript: The Learning Curve and Ease of UsePython vs. JavaScript: The Learning Curve and Ease of UseApr 16, 2025 am 12:12 AM

Python is more suitable for beginners, with a smooth learning curve and concise syntax; JavaScript is suitable for front-end development, with a steep learning curve and flexible syntax. 1. Python syntax is intuitive and suitable for data science and back-end development. 2. JavaScript is flexible and widely used in front-end and server-side programming.

Python vs. JavaScript: Community, Libraries, and ResourcesPython vs. JavaScript: Community, Libraries, and ResourcesApr 15, 2025 am 12:16 AM

Python and JavaScript have their own advantages and disadvantages in terms of community, libraries and resources. 1) The Python community is friendly and suitable for beginners, but the front-end development resources are not as rich as JavaScript. 2) Python is powerful in data science and machine learning libraries, while JavaScript is better in front-end development libraries and frameworks. 3) Both have rich learning resources, but Python is suitable for starting with official documents, while JavaScript is better with MDNWebDocs. The choice should be based on project needs and personal interests.

From C/C   to JavaScript: How It All WorksFrom C/C to JavaScript: How It All WorksApr 14, 2025 am 12:05 AM

The shift from C/C to JavaScript requires adapting to dynamic typing, garbage collection and asynchronous programming. 1) C/C is a statically typed language that requires manual memory management, while JavaScript is dynamically typed and garbage collection is automatically processed. 2) C/C needs to be compiled into machine code, while JavaScript is an interpreted language. 3) JavaScript introduces concepts such as closures, prototype chains and Promise, which enhances flexibility and asynchronous programming capabilities.

JavaScript Engines: Comparing ImplementationsJavaScript Engines: Comparing ImplementationsApr 13, 2025 am 12:05 AM

Different JavaScript engines have different effects when parsing and executing JavaScript code, because the implementation principles and optimization strategies of each engine differ. 1. Lexical analysis: convert source code into lexical unit. 2. Grammar analysis: Generate an abstract syntax tree. 3. Optimization and compilation: Generate machine code through the JIT compiler. 4. Execute: Run the machine code. V8 engine optimizes through instant compilation and hidden class, SpiderMonkey uses a type inference system, resulting in different performance performance on the same code.

Beyond the Browser: JavaScript in the Real WorldBeyond the Browser: JavaScript in the Real WorldApr 12, 2025 am 12:06 AM

JavaScript's applications in the real world include server-side programming, mobile application development and Internet of Things control: 1. Server-side programming is realized through Node.js, suitable for high concurrent request processing. 2. Mobile application development is carried out through ReactNative and supports cross-platform deployment. 3. Used for IoT device control through Johnny-Five library, suitable for hardware interaction.

See all articles

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Tools

mPDF

mPDF

mPDF is a PHP library that can generate PDF files from UTF-8 encoded HTML. The original author, Ian Back, wrote mPDF to output PDF files "on the fly" from his website and handle different languages. It is slower than original scripts like HTML2FPDF and produces larger files when using Unicode fonts, but supports CSS styles etc. and has a lot of enhancements. Supports almost all languages, including RTL (Arabic and Hebrew) and CJK (Chinese, Japanese and Korean). Supports nested block-level elements (such as P, DIV),

VSCode Windows 64-bit Download

VSCode Windows 64-bit Download

A free and powerful IDE editor launched by Microsoft

EditPlus Chinese cracked version

EditPlus Chinese cracked version

Small size, syntax highlighting, does not support code prompt function

MantisBT

MantisBT

Mantis is an easy-to-deploy web-based defect tracking tool designed to aid in product defect tracking. It requires PHP, MySQL and a web server. Check out our demo and hosting services.

SublimeText3 Chinese version

SublimeText3 Chinese version

Chinese version, very easy to use