NPM 核心知识点:一份清晰易懂的复习指南

如果你正在学习 Node.js 或现代前端开发,那么 NPM (Node Package Manager) 就是你每天都要打交道的好朋友。它就像一个巨大的应用商店,只不过里面装的都是代码模块。

这篇指南会帮你快速梳理 NPM 最核心的知识点,让你一看就懂,一学就会。

一、 项目的诞生:三个关键文件

当我们开始一个新项目时,通常会用 NPM 来打下地基。这个过程会生成三个非常重要的东西:

  1. package.json:项目的"身份证"

    • 如何生成 :在项目文件夹里运行 npm init -y。
    • 作用 :它是一个 JSON 文件,记录了项目的基本信息,比如项目名称、版本号,最重要的是,它会列出你的项目需要哪些第三方包(也就是依赖)。
  2. node_modules:项目的"大仓库"

    • 如何生成 :运行 npm install。
    • 作用 :这是一个文件夹,NPM 会把 package.json 里记录的所有依赖包都下载到这里。你的代码能正常运行,就靠这个"仓库"里的模块。
  3. package-lock.json:项目的"版本锁"

    • 如何生成 :运行 npm install 时自动生成。
    • 作用 :这个文件的作用至关重要!它会精确记录 你当前安装的每一个包的具体版本号。这样,无论你或你的同事在任何时候、任何电脑上运行 npm install,都能保证安装的包版本是完全一致的,避免了很多不必要的麻烦。

小结 :npm init -y 创建身份证,npm install 根据身份证建仓库、上版本锁。


二、 两种最重要的"帮手":生产依赖 vs. 开发依赖

你的项目依赖可以分为两种,理解它们的区别非常关键。

我们可以用一个盖房子的比喻来理解:

  • 生产依赖 (dependencies)

    • 是什么 :它们是构成房子的砖头、水泥和钢筋。没有它们,你的线上应用就无法运行。
    • 例子 :react, vue, echarts, axios。
    • 如何安装 :npm install 包名 (在现代版本中 --save 是默认的,可以不写)。
    • 记录位置 :package.json 文件的 dependencies 字段。
  • 开发依赖 (devDependencies)

    • 是什么 :它们是盖房子时用的脚手架、起重机和设计图纸。它们只在开发过程中帮助你,房子盖好后就会被拆掉,不会交给房主。
    • 例子 :vite, eslint, jest (构建工具、代码检查、测试工具)。
    • 如何安装 :npm install 包名 --save-dev (简写:npm install 包名 -D)。
    • 记录位置 :package.json 文件的 devDependencies 字段。

小结 :线上要用的装成生产依赖 ,只在开发时用的装成开发依赖 (-D)。

专业技巧 :当你在服务器上部署项目时,可以运行 npm install --production,这个命令只会安装生产依赖,让部署过程更快、更轻量。


三、 两种安装"地点":项目里 vs. 电脑里

  • 本地安装(项目里)

    • 这是默认 的安装方式,包会被安装到项目的 node_modules 文件夹里,只对当前项目有效。我们平时安装的 echarts、react 等都属于这种。
  • 全局安装(电脑里)

    • 如何安装 :npm install 包名 -g (-g 代表 global)。
    • 作用 :主要用来安装那些提供命令行工具的包,让你可以在电脑的任何位置使用它。
    • 例子 :nrm, nodemon, http-server。
    • 安装位置:一个你电脑上的公共文件夹,所有项目共享。

小结 :大部分包都安装在项目里。只有那些需要在任何地方都能敲命令的工具,才需要全局安装 (-g)。


四、 两个提效"神器"

  1. nrm:网络"加速器"

    • 问题:NPM 的官方服务器在国外,有时下载速度很慢。

    • nrm 是什么:一个帮你快速切换 NPM 下载源的工具。

    • 使用四步曲:

      1. npm install nrm -g ------ 全局安装 nrm。
      2. nrm ls ------ 查看所有可用的下载源列表。
      3. nrm test ------ 测试哪个源的速度最快。
      4. nrm use <名字> ------ 切换到最快的源(例如 nrm use taobao)。
  2. scripts:自定义"快捷键"

    • 是什么 :package.json 文件里有一个 scripts 字段,你可以在里面定义自己的命令别名。

    • 如何使用:

      json 复制代码
      "scripts": {
        "dev": "vite",
        "build": "vite build"
      }
    • 如何运行 :在终端输入 npm run dev 就等同于输入 vite。这让启动和构建项目变得非常简单。

相关推荐
吴凡wudianmei3 分钟前
从 0 搭一个 AI Agent(四):SSE 跑通之后,三处“契约错配”与它们的修复边界
前端·后端·aigc
不可能片场4 分钟前
Electron 发布 别拿 load 事件当页面就绪
前端·electron
paopaokaka_luck13 分钟前
灾害应急物资管理系统(AI应急助手、Echarts可视化数据看板、捐赠入库联动、 物资全流程管理、库存变动追溯、灾情资讯与互动反馈、物资发放公示)
java·前端·javascript·spring boot·mysql·tomcat·echarts
kyriewen15 分钟前
我验了 7 种 sticky 失效说法:3 种根本不成立
前端·javascript·程序员
程序边界21 分钟前
一台数据集成软件的拆解笔记(下):一致性、容错、跑批与迁移,KFS 真正难的地方在这
java·前端·笔记
健康活着就好22 分钟前
# 前端图片优化实战,首屏加载提速60%
前端
不一样的少年_37 分钟前
不花一分额外 API 钱,用现成的 Claude Code / Codex / Cursor 搭建 AI 个人知识库
前端·后端·ai编程
tryCbest1 小时前
ES6 ( ECMAScript 2015)核心语法
前端·ecmascript·es6
李小轰_Rex2 小时前
零开销 AI 数字人方案|Live2D 数字人驱动方案分享
前端·aigc
ModyQyW2 小时前
vite-plugin-uni-manifest 0.7:在 uni-app 读取之前生成
前端·uni-app