Lecture05-npm 装包（用 node 运行）

管理员
2026-10-17
前端-基础语法
62
0
文章目录

    [toc]

    单词词性音标含义
    npmn./ˌen piː ˈem/Node 自带的包管理工具，一句 npm install 就把包下到项目里
    packagen./ˈpækɪdʒ/包，别人写好的、能直接 import 使用的功能模块
    dependenciesn./dɪˈpendənsiz/运行时依赖，记录在 package.json 里，打包上线也要用
    devDependenciesn./ˌdev dɪˈpendənsiz/开发依赖，只在开发时用、不打包上线，用 -D 安装
    registryn./ˈredʒɪstri/包仓库/镜像源，安装失败时可切换成 npmmirror
    axiosn./ˈæksiəs/常用的 HTTP 请求库，本节把它作为装包示例
    tsxn./tiː es eks/开发期让 node 直接跑 .ts 文件的工具，第 6 节要用到

    Lecture05-npm 装包（用 node 运行）

    1、本节讲什么

    学会用 npm 安装第三方库（相当于 Java 的 Maven 加依赖），重点搞懂装包的几种写法、版本号、以及 package.json 怎么帮你管理依赖。

    2、概念速览

    什么是包（package）：别人写好的、能直接 import 用的功能模块，相当于 Java 的 jar / Maven 依赖。

    什么是 npm：Node 自带的"装包工具"（相当于 Maven），一句 npm install 就把包下到项目里，并记录进 package.json。

    正确 vs 误区：能装现成包就别自己造轮子；但也要"少而精"——包越多，兼容问题越多。

    3、先看效果

    npm install axios dayjs      # 一次装多个包
npm i lodash                 # install 可简写 i
npm install                  # 只写 install：按 package.json 依赖列表装

    装完打开 package.json，能看到多了一列依赖。

    4、照着做

    ① npm 一次性指定多个包安装

    npm install axios dayjs element-plus

    一个命令装多个包，包名用空格隔开——比一个个 npm install 快。

    ② install 可简写 i

    npm i axios      # 等价于 npm install axios

    两种写法效果完全一样，教程里两种都会出现，你都认得。

    ③ 装包时指定版本号 vs 不指定

    npm install axios              # 不指定：装最新版，package.json 记录 ^7.0.0（可升小版本）
npm install axios@1.7.0        # 指定精确版本：锁死 1.7.0
npm install axios@^1.0.0       # 指定范围：>=1.0.0 且 <2.0.0

    区别一句话：不指定 = 装最新并允许以后小版本升级（灵活但易变）；指定精确版本 = 锁死（团队一致、排查稳定）。

    ④ npm 把依赖写入 package.json

    每次 npm install 包名，npm 自动把包名和版本写进 package.json 的 dependencies（像 pom.xml 的依赖列表）。npm install -D 包名 则写进 devDependencies（只在开发用、不打包上线）。

    ⑤ npm install（不带包名）按依赖列表装

    换电脑 / 拿同学的项目：package.json 已有依赖列表，但 node_modules 还没有。此时直接：

    npm install

    npm 会照着 package.json 里的依赖列表全部装一遍。所以 package.json 是"清单"、node_modules 是"实物"：传项目只传清单，别人 npm install 就能还原实物。

    ⑥ 顺手装后面要用的 tsx

    npm install -D tsx     # 开发期让 node 直接跑 .ts 文件，第 6 节要用（开发依赖，用 -D）

    5、常见疑问

    • Q：npm install 报错装不上？ A：多数是国际网络问题，换镜像源一次解决：
    npm config set registry https://registry.npmmirror.com

    然后重新 npm install。

    • Q：-D 是什么？ A：--save-dev 的简写，写进 devDependencies（只在开发用）。tsx 这类就该用 -D 装。
    • Q：装完的包在哪？ A：在 node_modules/，别手动翻，直接用 import 引用。看 package.json 的 dependencies 能知道装了啥、什么版本（像 pom.xml）。
    • Q：删掉一个包？ A：npm uninstall dayjs。

    6、规范要点

    • 少而精地装包：能不用第三方库就别用，包越少越不容易出兼容问题。
    • 关键依赖锁定精确版本（包名@版本号），避免团队间版本不一致。
    • 装包前想清楚它是"运行时用"（dependencies）还是"开发用"（devDependencies，加 -D）。

    7、本节验证

    • 会用 npm install 包名 装包，也知道一条命令用空格隔开可装多个包 ✅
    • 知道 install 可简写为 i，两种写法效果一样 ✅
    • 分得清不指定版本 / @版本号 / @^范围 三种写法的区别 ✅
    • 知道 npm install（不带包名）会照着 package.json 依赖列表全部安装 ✅
    • 分得清 dependencies 与 devDependencies，会用 -D 装开发依赖（如 tsx）✅
    end