npm：包管理与工程化入门

这一课你将能做到

1. 用 package.json 管理项目元数据、依赖和脚本
2. 安装、更新、删除第三方包，理解 dependencies 与 devDependencies 的区别
3. 配置 scripts 实现一键启动、构建、测试，用 npx 直接运行包

为什么要学

现代前端项目不是从零手写所有代码，而是站在巨人的肩膀上组装：React 做 UI、axios 发请求、dayjs 处理时间、Tailwind 写样式。npm（Node Package Manager）就是管理这些「积木」的工具。它负责下载包、管理版本、执行命令。

不会 npm，你就无法使用现代前端生态。npm install、npm run dev、npm run build 是每个前端工程师每天都要敲的命令。

先建立图像

一个典型的 npm 项目结构：

my-app/
├── node_modules/      ← 所有第三方包下载到这里（不提交 Git）
├── package.json       ← 项目说明书：名称、版本、依赖、脚本
├── package-lock.json  ← 精确锁定依赖版本（要提交 Git）
└── index.js

package.json 是项目的身份证和账本，node_modules 是仓库本身，package-lock.json 是账本副本，确保团队成员装的是同一版本。

跟着做

步骤 1：初始化项目

mkdir my-app && cd my-app

# 交互式初始化（一路回车用默认值）
npm init

# 或快速初始化（跳过提问）
npm init -y

生成 package.json：

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

步骤 2：安装依赖

# 安装运行依赖（生产环境需要）
npm install lodash

# 安装开发依赖（只有开发时需要，如测试框架、构建工具）
npm install --save-dev vitest

# 简写
npm i lodash
npm i -D vitest

# 安装指定版本
npm install lodash@4.17.21

安装后 package.json 自动更新：

{
  "dependencies": {
    "lodash": "^4.17.21"
  },
  "devDependencies": {
    "vitest": "^1.6.0"
  }
}

• dependencies：项目运行时必须存在，比如 React、axios
• devDependencies：开发工具，比如测试框架、打包器，部署时不需要

^4.17.21 是语义化版本：允许升级到 4.x.x 的最新版，但不允许 5.0.0。~ 只锁定前两位，4.17.x。

步骤 3：使用安装的包

新建 index.js：

const _ = require("lodash");

const users = [
    { name: "张三", age: 25 },
    { name: "李四", age: 30 },
    { name: "王五", age: 20 }
];

// lodash 按年龄排序
const sorted = _.sortBy(users, ["age"]);
console.log(sorted);