第6天認真學習 Node.js - 認識 NPM

更新 發佈閱讀 4 分鐘

前言

NPM 全名 Node Package Manager,是 Node.js 內建的套件管理工具。開發者可以透過它安裝、管理、甚至分享各種第三方套件,讓專案開發不必每次都從零開始。

在安裝 Node.js 會一起連帶 NPM 也進行安裝

npm -v #檢查版本

建立自己的 package.json

當你用 Node.js 開發專案,NPM 會透過一個檔案來管理套件專案資訊,這個檔案就是package.json。

在專案資料夾輸入:

npm init

建立過程一步一步,問你專案的資訊:

  • name:專案名稱
  • version:版本號
  • description:簡單描述
  • entry point:程式進入點(通常是 index.js
  • author:作者名稱
  • license:授權方式

NPM 安裝套件流程

以安裝Express為例: npm: express
我們可以看到套件資訊:版本號、儲存庫、每週下載次數、授權等。

安裝指令:

npm i express

Step1. 開啟命令提示字元
Step2. 移動至該專案位置
Step3. 此狀態會分空專案、已有專案
空專案
npm initnpm i express
已有專案
npm i express
確定是否安裝:
1. node_modules 裡面有 express 資料夾
2. package.json 查看

package.json畫面

package.json畫面

Step4. 使用expressrequirre(’express’);

NPM 版本號介紹

package.json 常看到:

  • 1.2.3 : 1 主要版本號,2次要版本號 ,3 BUG修正
  • ^1.2.3:允許自動更新次要版號修正版 (1.x.x)
  • ~1.2.3:只允許更新修正版 (1.2.x)
  • 1.2.3鎖定固定版本
  • latest: 最新版本

npm install 三大參數

通常不會把node_modules龐大資料做版本控制,這是就會由 pagekage.json 參考資料得知需要安裝哪些模組,使用 npm install 就可把模組都安裝。

常見參數:

  • -save(預設):寫進 dependencies,專案正式需要用到
  • -save-dev:寫進 devDependencies,只在開發環境用,例如測試工具
  • -g:全域安裝,可以在任何地方使用

nodemon 套件介紹

主要功能是:當你修改專案中的檔案(例如.js,.ts,.json等)後,會自動監聽變化並重新啟動應用程式

這樣就不用每次手動停止/重啟伺服器,大幅提升開發效率
👉 適合用在:Express、Koa、NestJS 等 Node.js 後端專案。
✅ 減少重複動作
✅ 開發體驗更流暢
✅ 支援各種副檔名(不只.js

全域安裝

npm install -g nodemon

安裝完成後,可以直接執行:

nodemon index.js

node 指令比較

vocus|新世代的創作平台

和 前端熱更新(HMR) 比較

💡 nodemon 常常被拿來跟前端的 熱更新 (HMR, Hot Module Replacement) 比喻,但原理其實不太一樣。

  • 前端 HMR:只會更新改動過的模組,不需要整頁重整,所以像輸入框內容、頁面狀態通常還能保留。
  • nodemon:偵測到檔案異動後,會直接 整個 Node.js 應用程式重啟,所有狀態都會被清空。

👉 換句話說,nodemon 更像是「自動幫你重新整理後端伺服器」的工具,方便開發,但體驗和效能上比不上前端的 HMR。

留言
avatar-img
邁向躺平的工程師 Leo
0會員
6內容數
天生宅習慣的我,與外面繁忙的工作環境格格不入,因此選擇了能在辦公室內進行的軟體工程師職業。雖然室內的空間不如外面那麼廣闊,但在舒適的環境中,我可以心無旁鶩地靜下心來,專注於研發與思考。這條轉職路線,正是天生為我開好的選擇,成為了我日常的 RD 養成之旅。
2025/08/29
前言 在開發 Node.js 專案時,我們很常需要處理「路徑」: - 要找到一個檔案在哪裡 - 要讀取設定檔 - 要指定靜態檔案位置(像是 HTML、圖片) 這邊,Node.js幫我準備了兩個方便的全域變數:__dirname 和 __filename,與超好用的核心模組 path。 __di
Thumbnail
2025/08/29
前言 在開發 Node.js 專案時,我們很常需要處理「路徑」: - 要找到一個檔案在哪裡 - 要讀取設定檔 - 要指定靜態檔案位置(像是 HTML、圖片) 這邊,Node.js幫我準備了兩個方便的全域變數:__dirname 和 __filename,與超好用的核心模組 path。 __di
Thumbnail
2025/08/26
這篇文章介紹 Node.js 內建的 HTTP 模組,說明如何使用 createServer、request、response 和 listen 方法建立 Web Server,並提供測試和除錯技巧。
Thumbnail
2025/08/26
這篇文章介紹 Node.js 內建的 HTTP 模組,說明如何使用 createServer、request、response 和 listen 方法建立 Web Server,並提供測試和除錯技巧。
Thumbnail
2025/08/25
這篇文章說明如何在 Node.js 中使用 require() 與 module.exports (以及 exports) 來設計模組,並在 app.js 中載入 data.js 模組。文中包含步驟、進階用法、exports 與 module.exports 的比較,以及注意事項。
Thumbnail
2025/08/25
這篇文章說明如何在 Node.js 中使用 require() 與 module.exports (以及 exports) 來設計模組,並在 app.js 中載入 data.js 模組。文中包含步驟、進階用法、exports 與 module.exports 的比較,以及注意事項。
Thumbnail
看更多
你可能也想看
Thumbnail
本章節將引導你如何建立一個TypeScript開發環境,這包括安裝Node.js、npm和TypeScript,建立一個TypeScript項目,設置編輯器,以及編寫和編譯TypeScript代碼。在完成這些步驟之後,你將能夠編寫、編譯和運行TypeScript代碼。
Thumbnail
本章節將引導你如何建立一個TypeScript開發環境,這包括安裝Node.js、npm和TypeScript,建立一個TypeScript項目,設置編輯器,以及編寫和編譯TypeScript代碼。在完成這些步驟之後,你將能夠編寫、編譯和運行TypeScript代碼。
Thumbnail
npm(全名 Node Package Manager,node套件管理器)
Thumbnail
npm(全名 Node Package Manager,node套件管理器)
Thumbnail
有一天有位大神問我你知道npm yarn pnpm bun 之間的差別?我突然楞神一下!!!! 好吧我從未想過這個問題於是我開始研究 使用方式:與其他工具類似,通過命令行使用,但具有自己的一些特定命令和功能。 適合情境:目前在市場上使用較少,主要在一些追求性能和速度優化的專案中或者對於新技
Thumbnail
有一天有位大神問我你知道npm yarn pnpm bun 之間的差別?我突然楞神一下!!!! 好吧我從未想過這個問題於是我開始研究 使用方式:與其他工具類似,通過命令行使用,但具有自己的一些特定命令和功能。 適合情境:目前在市場上使用較少,主要在一些追求性能和速度優化的專案中或者對於新技
Thumbnail
因為最近想嘗試編碼風格,於是就選了一套比較"不嚴格"的輔助工具來摸索。 編輯器 VS CODE 框架 VUE3 打包工具 VITE 編碼風格 Standard 環境 version { "nodejs":"v18.18.0", "npm":"9.8.1" }
Thumbnail
因為最近想嘗試編碼風格,於是就選了一套比較"不嚴格"的輔助工具來摸索。 編輯器 VS CODE 框架 VUE3 打包工具 VITE 編碼風格 Standard 環境 version { "nodejs":"v18.18.0", "npm":"9.8.1" }
Thumbnail
5 月,方格創作島正式開島。這是一趟 28 天的創作旅程。活動期間,每週都會有新的任務地圖與陪跑計畫,從最簡單的帳號使用、沙龍建立,到帶著你從一句話、一張照片開始,一步一步找到屬於自己的創作節奏。不需要長篇大論,不需要完美的文筆,只需要帶上你今天的日常,就可以出發。征服創作島,抱回靈感與大獎!
Thumbnail
5 月,方格創作島正式開島。這是一趟 28 天的創作旅程。活動期間,每週都會有新的任務地圖與陪跑計畫,從最簡單的帳號使用、沙龍建立,到帶著你從一句話、一張照片開始,一步一步找到屬於自己的創作節奏。不需要長篇大論,不需要完美的文筆,只需要帶上你今天的日常,就可以出發。征服創作島,抱回靈感與大獎!
Thumbnail
Node.js是一個JavaScript運行環境。它使用了一個非阻塞、事件驅動的I/O模型,使其非常適合用於數據密集型的即時應用程序。簡單來說,Node.js允許你使用JavaScript來編寫伺服器端代碼。 nvm 安裝nvm Windows : 點擊 Releases · coreybut
Thumbnail
Node.js是一個JavaScript運行環境。它使用了一個非阻塞、事件驅動的I/O模型,使其非常適合用於數據密集型的即時應用程序。簡單來說,Node.js允許你使用JavaScript來編寫伺服器端代碼。 nvm 安裝nvm Windows : 點擊 Releases · coreybut
Thumbnail
NPM 全稱為 ( Node Package Manager ),直接翻譯就是 "node套件管理器" ,是 Node.js 預設的,當下載 Node.js 時也會一並下載到本機端並安裝,而 Node.js 則是能讓 JavaScript 語法實現在後端伺服器運行的一種環境,可謂是前端開發的好朋友。
Thumbnail
NPM 全稱為 ( Node Package Manager ),直接翻譯就是 "node套件管理器" ,是 Node.js 預設的,當下載 Node.js 時也會一並下載到本機端並安裝,而 Node.js 則是能讓 JavaScript 語法實現在後端伺服器運行的一種環境,可謂是前端開發的好朋友。
Thumbnail
當代名導基里爾.賽勒布倫尼科夫身兼電影、劇場與歌劇導演,其作品流動著強烈的反叛與詩意。在俄烏戰爭爆發後,他持續以創作回應專制體制的壓迫。《傳奇:帕拉贊諾夫的十段殘篇》致敬蘇聯電影大師帕拉贊諾夫。本文作者透過媒介本質的分析,解構賽勒布倫尼科夫如何利用影劇雙棲的特質,在荒謬世道中尋找藝術的「生存之道」。
Thumbnail
當代名導基里爾.賽勒布倫尼科夫身兼電影、劇場與歌劇導演,其作品流動著強烈的反叛與詩意。在俄烏戰爭爆發後,他持續以創作回應專制體制的壓迫。《傳奇:帕拉贊諾夫的十段殘篇》致敬蘇聯電影大師帕拉贊諾夫。本文作者透過媒介本質的分析,解構賽勒布倫尼科夫如何利用影劇雙棲的特質,在荒謬世道中尋找藝術的「生存之道」。
Thumbnail
套件(Package)是將程式或程式庫進行組織、分發和共享的一種方式。在軟體開發中,套件通常包含了相關的程式碼、資源文件和元數據,並提供了統一的名稱空間和版本管理。
Thumbnail
套件(Package)是將程式或程式庫進行組織、分發和共享的一種方式。在軟體開發中,套件通常包含了相關的程式碼、資源文件和元數據,並提供了統一的名稱空間和版本管理。
Thumbnail
見諸參與鄧伯宸口述,鄧湘庭於〈那個大霧的時代〉記述父親回憶,鄧伯宸因故遭受牽連,而案件核心的三人,在鄧伯宸記憶裡:「成立了成大共產黨,他們製作了五星徽章,印刷共產黨宣言——刻鋼板的——他們收集中共空飄的傳單,以及中國共產黨中央委員會有關文化大革命決議文的英文打字稿,另外還有手槍子彈十發。」
Thumbnail
見諸參與鄧伯宸口述,鄧湘庭於〈那個大霧的時代〉記述父親回憶,鄧伯宸因故遭受牽連,而案件核心的三人,在鄧伯宸記憶裡:「成立了成大共產黨,他們製作了五星徽章,印刷共產黨宣言——刻鋼板的——他們收集中共空飄的傳單,以及中國共產黨中央委員會有關文化大革命決議文的英文打字稿,另外還有手槍子彈十發。」
Thumbnail
Express 是一個流行的 web 框架,使用 JavsScript 實現,執行在 node 環境上,主要用來寫後端應用。
Thumbnail
Express 是一個流行的 web 框架,使用 JavsScript 實現,執行在 node 環境上,主要用來寫後端應用。
Thumbnail
當時間變少之後,看戲反而變得更加重要——這是在成為母親之後,我第一次誠實地面對這一件事:我沒有那麼多的晚上,可以任性地留給自己了。看戲不再只是「今天有沒有空」,而是牽動整個週末的結構,誰應該照顧孩子,我該在什麼時間回到家,隔天還有沒有精神帶小孩⋯⋯於是,我不得不學會一件以前並不擅長的事:挑選。
Thumbnail
當時間變少之後,看戲反而變得更加重要——這是在成為母親之後,我第一次誠實地面對這一件事:我沒有那麼多的晚上,可以任性地留給自己了。看戲不再只是「今天有沒有空」,而是牽動整個週末的結構,誰應該照顧孩子,我該在什麼時間回到家,隔天還有沒有精神帶小孩⋯⋯於是,我不得不學會一件以前並不擅長的事:挑選。
追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News