首頁 web前端 js教程 NPM 使用介紹

NPM 使用介紹

Sep 23, 2019 pm 12:08 PM
npm

NPM是隨同NodeJS一起安裝的套件管理工具,能解決NodeJS程式碼部署上的許多問題,常見的使用場景有以下幾種:

  • 允許使用者從NPM伺服器下載別人寫的第三方包到本地使用。

  • 允許使用者從NPM伺服器下載並安裝別人編寫的命令列程式到本機使用。

  • 允許使用者將自己編寫的套件或命令列程式上傳到NPM伺服器供別人使用。

由於新版本的nodejs已經整合了npm,所以之前npm也一併安裝好了。同樣可以輸入 "npm -v" 來測試是否成功安裝。指令如下,出現版本提示表示安裝成功:

$ npm -v
2.3.0
登入後複製

如果你安裝的是舊版的npm,可以很容易得透過npm 指令來升級,指令如下:

$ sudo npm install npm -g
/usr/local/bin/npm -> /usr/local/lib/node_modules/npm/bin/npm-cli.js
npm@2.14.2 /usr/local/lib/node_modules/npm
登入後複製

如果是Window系統使用以下指令即可:

npm install npm -g
登入後複製

使用淘寶鏡像的指令:

npm install -g cnpm --registry=https://registry.npm.taobao.org
登入後複製

使用npm 指令安裝模組


##npm 安裝Node.js 模組語法格式如下:

$ npm install <Module Name>
登入後複製
以下實例,我們使用npm 指令安裝常用的Node.js web框架模組express:

$ npm install express
登入後複製
    安裝好之後,express 套件就放在了工程目錄下的node_modules 目錄中,因此在程式碼中只需要通過require('express') 的方式就好,無需指定第三方套件路徑。
  • var express = require(&#39;express&#39;);
    登入後複製

  • 全域安裝與本機安裝

#npm 的套件安裝分為本機安裝(local)、全域安裝(global)兩種,從敲的命令列來看,差別只是有沒有-g而已,例如

npm install express          # 本地安装
npm install express -g   # 全局安装
登入後複製
如果出現以下錯誤:
npm err! Error: connect ECONNREFUSED 127.0.0.1:8087
登入後複製

解決辦法為:
    $ npm config set proxy null
    登入後複製
  • 本機安裝

  • 1. 將安裝套件放在./node_modules 下(執行npm 指令時所在的目錄),如果沒有node_modules 目錄,會在目前執行npm 指令的目錄下產生node_modules 目錄。

2. 可以透過 require() 來引入本機安裝的套件。

全域安裝

#1. 將安裝套件放在/usr/local 下或是你node 的安裝目錄。


2. 可以直接在命令列裡使用。 如果你希望具備兩者功能,則需要在兩個地方安裝它或使用 npm link。

接下來我們使用全域方式安裝 express

$ npm install express -g
登入後複製

安裝過程輸出如下內容,第一行輸出了模組的版本號及安裝位置。

express@4.13.3 node_modules/express
├── escape-html@1.0.2
├── range-parser@1.0.2
├── merge-descriptors@1.0.0
├── array-flatten@1.1.1
├── cookie@0.1.3
├── utils-merge@1.0.0
├── parseurl@1.3.0
├── cookie-signature@1.0.6
├── methods@1.1.1
├── fresh@0.3.0
├── vary@1.0.1
├── path-to-regexp@0.1.7
├── content-type@1.0.1
├── etag@1.7.0
├── serve-static@1.10.0
├── content-disposition@0.5.0
├── depd@1.0.1
├── qs@4.0.0
├── finalhandler@0.4.0 (unpipe@1.0.0)
├── on-finished@2.3.0 (ee-first@1.1.1)
├── proxy-addr@1.0.8 (forwarded@0.1.0, ipaddr.js@1.0.1)
├── debug@2.2.0 (ms@0.7.1)
├── type-is@1.6.8 (media-typer@0.3.0, mime-types@2.1.6)
├── accepts@1.2.12 (negotiator@0.5.3, mime-types@2.1.6)
└── send@0.13.0 (destroy@1.0.3, statuses@1.2.1, ms@0.7.1, mime@1.3.4, http-errors@1.3.1)
登入後複製

查看安裝資訊
  • 你可以使用下列指令來檢視所有全域安裝的模組:

    $ npm list -g
    ├─┬ cnpm@4.3.2
    │ ├── auto-correct@1.0.0
    │ ├── bagpipe@0.3.5
    │ ├── colors@1.1.2
    │ ├─┬ commander@2.9.0
    │ │ └── graceful-readlink@1.0.1
    │ ├─┬ cross-spawn@0.2.9
    │ │ └── lru-cache@2.7.3
    ……
    登入後複製
  • 如果要檢視某個模組的版本號,可以使用指令如下:
  • $ npm list grunt
    
    projectName@projectVersion /path/to/project/folder
    └── grunt@0.4.1
    登入後複製

  • 使用package.json

  • package.json 位於模組的目錄下,用於定義包的屬性。接下來讓我們來看下express 套件的package.json 文件,位於node_modules/express/package.json 內容:

    {
      "name": "express",
      "description": "Fast, unopinionated, minimalist web framework",
      "version": "4.13.3",
      "author": {
        "name": "TJ Holowaychuk",
        "email": "tj@vision-media.ca"
      },
      "contributors": [
        {
          "name": "Aaron Heckmann",
          "email": "aaron.heckmann+github@gmail.com"
        },
        {
          "name": "Ciaran Jessup",
          "email": "ciaranj@gmail.com"
        },
        {
          "name": "Douglas Christopher Wilson",
          "email": "doug@somethingdoug.com"
        },
        {
          "name": "Guillermo Rauch",
          "email": "rauchg@gmail.com"
        },
        {
          "name": "Jonathan Ong",
          "email": "me@jongleberry.com"
        },
        {
          "name": "Roman Shtylman",
          "email": "shtylman+expressjs@gmail.com"
        },
        {
          "name": "Young Jae Sim",
          "email": "hanul@hanul.me"
        }
      ],
      "license": "MIT",
      "repository": {
        "type": "git",
        "url": "git+https://github.com/strongloop/express.git"
      },
      "homepage": "http://expressjs.com/",
      "keywords": [
        "express",
        "framework",
        "sinatra",
        "web",
        "rest",
        "restful",
        "router",
        "app",
        "api"
      ],
      "dependencies": {
        "accepts": "~1.2.12",
        "array-flatten": "1.1.1",
        "content-disposition": "0.5.0",
        "content-type": "~1.0.1",
        "cookie": "0.1.3",
        "cookie-signature": "1.0.6",
        "debug": "~2.2.0",
        "depd": "~1.0.1",
        "escape-html": "1.0.2",
        "etag": "~1.7.0",
        "finalhandler": "0.4.0",
        "fresh": "0.3.0",
        "merge-descriptors": "1.0.0",
        "methods": "~1.1.1",
        "on-finished": "~2.3.0",
        "parseurl": "~1.3.0",
        "path-to-regexp": "0.1.7",
        "proxy-addr": "~1.0.8",
        "qs": "4.0.0",
        "range-parser": "~1.0.2",
        "send": "0.13.0",
        "serve-static": "~1.10.0",
        "type-is": "~1.6.6",
        "utils-merge": "1.0.0",
        "vary": "~1.0.1"
      },
      "devDependencies": {
        "after": "0.8.1",
        "ejs": "2.3.3",
        "istanbul": "0.3.17",
        "marked": "0.3.5",
        "mocha": "2.2.5",
        "should": "7.0.2",
        "supertest": "1.0.1",
        "body-parser": "~1.13.3",
        "connect-redis": "~2.4.1",
        "cookie-parser": "~1.3.5",
        "cookie-session": "~1.2.0",
        "express-session": "~1.11.3",
        "jade": "~1.11.0",
        "method-override": "~2.3.5",
        "morgan": "~1.6.1",
        "multiparty": "~4.1.2",
        "vhost": "~3.0.1"
      },
      "engines": {
        "node": ">= 0.10.0"
      },
      "files": [
        "LICENSE",
        "History.md",
        "Readme.md",
        "index.js",
        "lib/"
      ],
      "scripts": {
        "test": "mocha --require test/support/env --reporter spec --bail --check-leaks test/ test/acceptance/",
        "test-ci": "istanbul cover node_modules/mocha/bin/_mocha --report lcovonly -- --require test/support/env --reporter spec --check-leaks test/ test/acceptance/",
        "test-cov": "istanbul cover node_modules/mocha/bin/_mocha -- --require test/support/env --reporter dot --check-leaks test/ test/acceptance/",
        "test-tap": "mocha --require test/support/env --reporter tap --check-leaks test/ test/acceptance/"
      },
      "gitHead": "ef7ad681b245fba023843ce94f6bcb8e275bbb8e",
      "bugs": {
        "url": "https://github.com/strongloop/express/issues"
      },
      "_id": "express@4.13.3",
      "_shasum": "ddb2f1fb4502bf33598d2b032b037960ca6c80a3",
      "_from": "express@*",
      "_npmVersion": "1.4.28",
      "_npmUser": {
        "name": "dougwilson",
        "email": "doug@somethingdoug.com"
      },
      "maintainers": [
        {
          "name": "tjholowaychuk",
          "email": "tj@vision-media.ca"
        },
        {
          "name": "jongleberry",
          "email": "jonathanrichardong@gmail.com"
        },
        {
          "name": "dougwilson",
          "email": "doug@somethingdoug.com"
        },
        {
          "name": "rfeng",
          "email": "enjoyjava@gmail.com"
        },
        {
          "name": "aredridel",
          "email": "aredridel@dinhe.net"
        },
        {
          "name": "strongloop",
          "email": "callback@strongloop.com"
        },
        {
          "name": "defunctzombie",
          "email": "shtylman@gmail.com"
        }
      ],
      "dist": {
        "shasum": "ddb2f1fb4502bf33598d2b032b037960ca6c80a3",
        "tarball": "http://registry.npmjs.org/express/-/express-4.13.3.tgz"
      },
      "directories": {},
      "_resolved": "https://registry.npmjs.org/express/-/express-4.13.3.tgz",
      "readme": "ERROR: No README data found!"
    }
    登入後複製

  • Package.json 屬性說明
  • name - 套件名稱。

  • version - 套件的版本號碼。

  • description - 套件的描述。

  • homepage - 套件的官網 url 。

  • author - 套件的作者姓名。

contributors - 套件的其他貢獻者姓名。

dependencies - 依賴套件清單。如果依賴套件沒有安裝,npm 會自動將依賴套件安裝在 node_module 目錄下。

repository - 套件程式碼存放的地方的類型,可以是 git 或 svn,git 可在 Github 上。


main - main 欄位指定了程式的主入口文件,require('moduleName') 就會載入這個文件。這個欄位的預設值是模組根目錄下面的 index.js。

keywords - 關鍵字


解除安裝模組我們可以使用以下指令來卸載Node.js 模組。

$ npm uninstall express
登入後複製

卸載後,你可以到/node_modules/ 目錄下查看套件是否還存在,或使用以下指令查看:

$ npm ls
登入後複製

更新模組

我們可以使用以下指令更新模組:

$ npm update express
登入後複製

搜尋模組

######## #使用以下來搜尋模組:###
$ npm search express
登入後複製
############ 建立模組############建立模組,package.json 檔案是必不可少的。我們可以使用 NPM 產生 package.json 文件,產生的文件包含了基本的結果。 ###
$ 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> --save` afterwards to install a package and
save it as a dependency in the package.json file.
Press ^C at any time to quit.
name: (node_modules) runoob                   # 模块名
version: (1.0.0) 
description: Node.js 测试模块(www.runoob.com)  # 描述
entry point: (index.js) 
test command: make test
git repository: https://github.com/runoob/runoob.git  # Github 地址
keywords: 
author: 
license: (ISC) 
About to write to ……/node_modules/package.json:      # 生成地址
{
  "name": "runoob",
  "version": "1.0.0",
  "description": "Node.js 测试模块(www.runoob.com)",
  ……
}
Is this ok? (yes) yes
登入後複製
###以上的信息,你需要根據你自己的情況輸入。在最後輸入 "yes" 後會產生 package.json 檔案。 ######接下來我們可以使用以下命令在 npm 資源庫中註冊使用者(使用郵箱註冊):###
$ npm adduser
Username: mcmohd
Password:
Email: (this IS public) mcmohd@gmail.com
登入後複製
###接下來我們就用以下命令來發布模組:###
$ npm publish
登入後複製

如果你以上的步骤都操作正确,你就可以跟其他模块一样使用 npm 来安装。


版本号

使用NPM下载和发布代码时都会接触到版本号。NPM使用语义版本号来管理代码,这里简单介绍一下。

语义版本号分为X.Y.Z三位,分别代表主版本号、次版本号和补丁版本号。当代码变更时,版本号按以下原则更新。

  • 如果只是修复bug,需要更新Z位。

  • 如果是新增了功能,但是向下兼容,需要更新Y位。

  • 如果有大变动,向下不兼容,需要更新X位。

版本号有了这个保证后,在申明第三方包依赖时,除了可依赖于一个固定版本号外,还可依赖于某个范围的版本号。例如"argv": "0.0.x"表示依赖于0.0.x系列的最新版argv。

NPM支持的所有版本号范围指定方式可以查看官方文档


NPM 常用命令

除了本章介绍的部分外,NPM还提供了很多功能,package.json里也有很多其它有用的字段。

除了可以在【https://npmjs.org/doc/】查看官方文档外,这里再介绍一些NPM常用命令。

  • NPM提供了很多命令,例如install和publish,使用npm help可查看所有命令。

  • NPM提供了很多命令,例如install和publish,使用npm help可查看所有命令。

  • 使用npm help 可查看某条命令的详细帮助,例如npm help install。

  • 在package.json所在目录下使用npm install . -g可先在本地安装当前命令行程序,可用于发布前的本地测试。

  • 使用npm update 可以把当前目录下node_modules子目录里边的对应模块更新至最新版本。

  • 使用npm update -g可以把全局安装的对应命令行程序更新至最新版。

  • 使用npm cache clear可以清空NPM本地缓存,用于对付使用相同版本号发布新版本代码的人。

  • 使用npm unpublish @可以撤销发布自己发布过的某个版本代码。


使用淘宝 NPM 镜像

大家都知道国内直接使用 npm 的官方镜像是非常慢的,这里推荐使用淘宝 NPM 镜像。

淘宝 NPM 镜像是一个完整 npmjs.org 镜像,你可以用此代替官方版本(只读),同步频率目前为 10分钟 一次以保证尽量与官方服务同步。

你可以使用淘宝定制的 cnpm (gzip 压缩支持) 命令行工具代替默认的 npm:

$ npm install -g cnpm --registry=https://registry.npm.taobao.org
登入後複製

这样就可以使用 cnpm 命令来安装模块了:

$ cnpm install [name]
登入後複製

更多信息可以查阅:http://npm.taobao.org/。

以上是NPM 使用介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章!

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

熱門話題

Java教學
1659
14
CakePHP 教程
1416
52
Laravel 教程
1310
25
PHP教程
1258
29
C# 教程
1232
24
JavaScript套件管理器比較:Npm vs Yarn vs Pnpm JavaScript套件管理器比較:Npm vs Yarn vs Pnpm Aug 09, 2022 pm 04:22 PM

這篇文章帶大家了解三種JavaScript套件管理器(npm、yarn、pnpm),並將這三種套件管理器進行對比,聊聊npm、yarn、pnpm三者的差異和關聯,希望對大家有所幫助,有問題歡迎指出!

npm react 安裝報錯怎麼辦 npm react 安裝報錯怎麼辦 Dec 27, 2022 am 11:25 AM

npm react安裝錯誤的解決方法:1、開啟專案中的「package.json」文件,找到dependencies物件;2、將其中的「react.json」移到「devDependencies」;3、在終端機中執行「npm audit --production”即可修復警告。

一文解析package.json和package-lock.json 一文解析package.json和package-lock.json Sep 01, 2022 pm 08:02 PM

這篇文章帶大家詳解package.json和package-lock.json文件,希望對大家有幫助!

npm node gyp失敗怎麼辦 npm node gyp失敗怎麼辦 Dec 29, 2022 pm 02:42 PM

npm node gyp失敗是因為“node-gyp.js”跟“Node.js”版本不匹配,其解決辦法:1、透過“npm cache clean -f”清除node快取;2、透過“npm install -g n”安裝n模組;3、透過「n v12.21.0」指令安裝「node v12.21.0」版本即可。

node無法用npm指令怎麼辦 node無法用npm指令怎麼辦 Feb 08, 2023 am 10:09 AM

node無法用npm指令是因為沒有正確配置環境變量,其解決方法是:1、開啟“系統屬性”;2、找到“環境變數”->“系統變數”,然後編輯環境變數;3、找到nodejs所在的資料夾;4、點選「確定」即可。

聊聊npm配置國內鏡像(淘寶鏡像) 聊聊npm配置國內鏡像(淘寶鏡像) Aug 09, 2022 pm 12:06 PM

npm是node.js庫的套件管理工具,因為鏡像位址在國外,安裝庫會比較慢,可以將鏡像位址修改為國內地址(淘寶鏡像),來提供安裝庫的速度。

一文帶你了解npm的原理 一文帶你了解npm的原理 Aug 09, 2022 am 09:23 AM

npm 是 JavaScript世界的套件管理工具,並且是 Node.js平台的預設套件管理工具。透過 npm可以安裝、共享、分發程式碼,管理專案依賴關係。這篇文章帶大家了解npm的原理,希望對大家有幫助!

npm和node.js有關係嗎 npm和node.js有關係嗎 Jul 11, 2022 pm 06:00 PM

npm的中文意思是“node套件管理器”,是Node.js平台的預設套件管理工具,會隨著Nodejs一起安裝,npm管理對應node.js的第三方插件;透過npm可以安裝、共享、分發程式碼,管理node專案依賴關係。

See all articles