NPM 是甚麼?

閱讀時間約 5 分鐘
此筆記僅以個人清楚理解方式記錄

簡介

NPM 全稱為 ( Node Package Manager ),直接翻譯就是 " node套件管理器 " ,

是 Node.js 預設的,當下載 Node.js 時也會一並下載到本機端並安裝,

而 Node.js 則是能讓 JavaScript 實現在後端伺服器運行的一種環境,

我們可以透過 npm install xxx 來安裝他人製作好的模組來給自己的專案使用

[node.js 官網](https://nodejs.org/en)

安裝好之後我們可以在終端機查詢當前版本號

  • node -v node 版本
  • npm -v npm 版本


建立

npm init 為建立 npm 專案初始化

  • name 專案名稱
  • version 版本號
  • description 專案描述
  • entry point 檔案切入口
  • test command 有無測試
  • git repository 有無 Git 資源庫
  • keywords 查詢關鍵字
  • author 作者
  • license 是否開源

建立完會在當前資料夾產生 package.json

{
"name": "git-demo",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC"
}


安裝模組

我們以 Express 來說明,可以先看看該套件 npm 介紹

Express 套件

Express 套件

上面能看到

  • 安裝指令 install i express
  • 官網網址 expressjs.com/
  • 週下載次數 Weekly Downloads
  • 當前版本 Version
  • 授權 License

以此基本可見數據,我們可以知曉該套件是否活耀,並判斷是否要拿來使用

安裝完之後我們可以看到 package.json 多了 dependencies

{
"name": "git-demo",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"dependencies": {
"express": "^4.19.2"
}
}


而在專案資料夾內也多出了 node_modules 資料夾,是其他附加的套件


node_modules

node_modules


套件版本號

查詢套件清單指令

npm list


我們剛裝的 Express 為 ^4.19.2 其中個數字又有不同的涵義在

  • 4 : 主要版本 (大改版)
  • 19 : 次要版本 (小改版)
  • 2 : 修正 (維修、處理異常)
  • ^ : 鎖住大版本,自動更新小版本 4.x.x (不自動更新大阪本)
  • ~ : 鎖住大小版本,只更新 Bug 的修正 4.19.x
  • latest : 永遠保持最新版 (極少人使用,避免一更新整組壞掉)


  • '都沒寫' : 完全要符合該版本
  • > : 必須高於此版本
  • >= : 高於此版本,至少要相同
  • < : 必須低過此版本
  • <= : 要低於此版本,最高相同不能再高


縮寫

安裝

  • npm install xxx --save  npm i xxx
  • npm install xxx --save-dev  npm i xxx -D

移除

  • npm uninstall xxx --save  npm un xxx
  • npm uninstall xxx --save-dev  npm un xxx -D


後贅詞意

--save 生產環境,上線時需要依賴的套件

  • express
  • bootstrap5

--save-dev 開發環境,開發過程輔助

  • sass
  • jshint

-g 裝在本機全域,如果專案內找不到套件,會往全域找

  • nodeman
  • json-server


  • joker
  • 2024/05/16
1會員
10內容數
是一隻喜愛前端勇往直前的霹靂酷樂貓
留言0
查看全部
發表第一個留言支持創作者!
從 Google News 追蹤更多 vocus 的最新精選內容