构建工具

NPM零基础通俗易懂手册

NPM零基础通俗易懂手册(纯干货入门)

作者:洋柿子·2026-09-01·共 6 篇 · 当前 3

NPM零基础通俗易懂手册(纯干货入门)

一、NPM是什么?(大白话解释)

1.1 官方定义

NPM:Node Package Manager,Node.js 官方自带包管理器。目前是全球最大开源软件注册表。

1.2 最简单人话理解

  1. Node.js 是运行环境,NPM 就是它的应用商店。

  2. 专门用来:下载代码库、管理依赖、运行脚本、安装第三方工具。

  3. 写前端、Node、Vue、React、TS 全部离不开 NPM。

1.3 通俗直白比喻(最好懂、必背)

  • Node.js:手机系统(底层运行环境)。

  • NPM:应用商店(AppStore)。

  • 依赖包:抖音、微信、各种第三方APP。

  • package.json:手机安装清单,记录装了什么软件、版本多少。

二、Node 和 NPM 的关系(千万不要混淆)

  1. Node.js:JS 运行环境,让 JS 脱离浏览器,在电脑/服务器运行。

  2. NPM:安装 Node 后自带,不需要单独下载。

  3. 安装 Node = 同时装好 Node + NPM。

node -v    # 查看node版本
npm -v     # 查看npm版本

三、NPM 三大核心作用

  1. 安装依赖:下载第三方库(vue、axios、vite、express)。

  2. 管理版本:锁定依赖版本,防止版本混乱、别人跑不起来。

  3. 运行脚本:启动项目、打包项目、自定义命令(npm run)。

四、三大包管理器黄金对照表(面试必考)

工具 归属 速度 磁盘占用 现状
NPM 官方原生 最慢 最大,重复文件多 新手默认、最简单
Yarn Meta出品 中等 一般 老旧项目常见,逐渐淘汰
PNPM 新生代 最快 极小,硬链接复用 现代项目、Monorepo首选

选型口诀:新手用NPM、老项目用Yarn、新项目一律PNPM(呼应你之前学的Monorepo)。

五、NPM 必背命令(全部最简、高频)

5.1 项目初始化

npm init        # 一步步手动创建package.json
npm init -y     # 全部默认,一键快速生成(最常用)

5.2 安装依赖

npm install 包名        # 生产依赖,项目上线也要用
npm install -D 包名     # 开发依赖,仅写代码时用
npm install -g 包名     # 全局安装,整台电脑通用
npm i 包名              # install简写,日常偷懒写法

5.3 删除、更新

npm uninstall 包名  # 卸载依赖
npm update 包名      # 更新依赖版本

5.4 运行脚本

npm run dev     # 启动开发环境
npm run build   # 打包上线代码

5.5 还原项目(最重要)

npm install   # 读取package.json,一次性安装全部依赖

场景:克隆别人代码、换电脑、删了node_modules,直接 npm i 一键还原。

六、两个核心文件(必须分清)

6.1 package.json(手动可改)

项目说明书,记录:项目名字、版本、作者、脚本、依赖列表。

6.2 package-lock.json(绝对不要手动改)

版本锁死文件,精准记录每一个依赖的详细版本、下载地址。

作用:保证所有人、所有电脑安装的版本完全一致,不会出现"我能跑你报错"。

七、本地安装 VS 全局安装(高频面试)

类型 指令 存放位置 使用场景
本地安装 npm i 包名 当前项目node_modules 项目专用,只给当前项目用
全局安装 npm i -g 包名 系统公共目录 工具类,所有项目通用(git、vue-cli)

八、国内必做:淘宝镜像(解决下载慢、报错)

8.1 为什么要换镜像?

NPM 官方服务器在国外,国内下载慢、超时、443报错、下载失败。

8.2 一键切换淘宝镜像

npm config set registry https://registry.npmmirror.com

8.3 查看当前镜像源

npm config get registry

九、新手常见坑(直白避雷、血泪经验)

  1. 不要手动改 lock 文件:会导致依赖错乱、项目炸崩。

  2. 不要乱全局安装:全局包太多导致版本冲突,污染电脑环境。

  3. node_modules不要上传git:体积巨大,必须写入.gitignore忽略。

  4. 网络报错第一件事换镜像:超时、443、拉不下来一律换淘宝源。

  5. 权限报错加sudo:Linux下安装全局包报错,前面加sudo。

  6. 不要删package.json:删了项目直接报废,依赖全部丢失。

十、关联你之前学的技术(串联打通)

  1. Monorepo:依靠 pnpm workspace 管理多包,底层还是包管理器原理。

  2. Vim:可以配置 vimrc + npm 插件,美化编辑器。

  3. Linux:开发必备环境,npm 几乎全在 Linux 终端敲命令。

十一、通俗易懂总结(终极背诵口诀)

  1. NPM = Node官方应用商店,专门管理代码包。

  2. 两大文件:json手写改、lock不要动。

  3. 安装口诀:普通不加参、开发加-D、全局加-g。

  4. 选型口诀:新手npm、老项目yarn、新项目pnpm。

  5. 国内必做:第一时间切换淘宝镜像,解决90%下载报错。