前端工程化-包管理NPM-package.json 和 package-lock.json 详解

package.json 和 package-lock.json 详解

1.package.json

基本概念

package.json 是 Node.js 项目的核心配置文件,它定义了项目的基本信息、依赖项、脚本命令等。

主要字段

基本信息字段

makefile 复制代码
name: 项目名称(必填)

version: 项目版本(必填,遵循语义化版本规范)  版本号形如:X.Y.Z,有三部分组成,依次叫主版本号、次版本号、修订号;

description: 项目描述

author: 作者信息

license: 开源许可证

依赖管理字段

makefile 复制代码
dependencies: 生产环境依赖

devDependencies: 开发环境依赖

peerDependencies: 同伴依赖

optionalDependencies: 可选依赖

脚本字段

arduino 复制代码
scripts: 定义可以通过 npm run 执行的脚本命令

其他配置

makefile 复制代码
main: 项目入口文件

repository: 代码仓库信息

keywords: 关键词数组,用于 npm 搜索

engines: 指定 Node.js 和 npm 的版本要求

示例

js 复制代码
{
  "name": "my-project",
  "version": "3.2.1",
  "description": "A sample project",
  "main": "index.js",
  "scripts": {
    "start": "node index.js",
    "test": "jest"
  },
  "dependencies": {
    "express": "^4.17.1"
  },
  "devDependencies": {
    "jest": "^26.6.3"
  }
}

2.package-lock.json

基本概念

package-lock.json 是 npm 5+ 版本引入的文件,用于锁定依赖树的确切版本,确保不同环境下安装完全相同的依赖。

主要特点

复制代码
自动生成:由 npm 自动创建和维护,使用 npm install 安装包后就会自动生成。

精确版本控制:记录每个依赖包的确切版本

依赖关系树:完整记录依赖树结构

安装优化:加快后续安装速度

文件作用

复制代码
版本锁定:防止因语义化版本导致的意外升级

一致性保证:确保团队成员和 CI/CD 系统使用相同的依赖版本

安装效率:记录已解析的依赖树,避免重复计算

与 package.json 的关系

go 复制代码
package.json 定义的是版本范围

package-lock.json 记录的是确切版本

当两者冲突时,以 package-lock.json 为准(npm 5+)

3.最佳实践

markdown 复制代码
版本管理

    将 package-lock.json 提交到版本控制系统

    不要手动修改 package-lock.json
依赖安装

    npm 安装包的方式分为本地安装和全局安装。安装使用npm install或简写形式npm i。
    本地安装

    使用 npm ci 命令(基于 package-lock.json 安装,用于生产环境)

    使用 npm install <参数>  <package-name> 命令(会更新 package-lock.json,用于开发环境)

    全局安装 

    npm i -g  <package-name>

    npm i --global <package-name>

    让安装的包放到对应依赖位置

    开发依赖(devDependencies)中,传递参数 --save-dev 或 -D 即可。

    生产依赖(dependencies)中,传递参数 --save 或 -S 即可。

    不想放在开发依赖也不想放在生产依赖,使用npm install --no-save。

        注意:包默认安装到生产依赖(dependencies)中

    线上环境,只需要安装dependencies中的包,使用npm install --prod命令。

    删除包 

          npm uninstall  <package-name>
        // 简写形式
        npm un  <package-name>

        全局删除     npm uninstall -g   <package-name>
更新依赖

    使用 npm update 更新次要版本和补丁版本

    使用 npm install package@version 更新主版本
安全考虑

    定期运行 npm audit 检查安全漏洞

    使用 npm audit fix 修复已知漏洞

4.常见问题

csharp 复制代码
    4.1: 为什么有时 node_modules 和 package-lock.json 会不一致?

             通常是因为手动修改了 package.json 或在不同 npm 版本间切换导致的。可以删除         node_modules 和 package-lock.json 后重新安装。
    4.2.可以删除 package-lock.json 吗?

            不推荐,删除后会导致依赖版本不确定性,可能引入兼容性问题。

    4.3. yarn.lock 和 package-lock.json 有什么区别?
            两者功能类似,都是锁定依赖版本,只是格式不同。yarn.lock 是 Yarn 包管理工具生成的。
相关推荐
用户059540174461 小时前
LLM对话记忆测试踩坑实录:手工回归30分钟,自动化后2分钟发现3个隐藏Bug
前端·css
Ashley的成长之路2 小时前
前端性能优化实战手册·第2篇:资源加载策略全解
前端·性能优化·资源加载·http/3·性能优化实战·资源加载优化
浅水壁虎3 小时前
vue基础(第二章 )
前端·javascript·vue.js
界面开发小八哥3 小时前
界面控件DevExtreme v26.1新版亮点——支持Angular 22
前端·javascript·angular.js·devexpress·ui开发·devextreme
Getflare3 小时前
前端 + UI 设计 + AI:这不是三个工种,是一个新三角能力模型(附自检清单)
前端·人工智能·ui
oil欧哟3 小时前
我做了一个 Vibe Coding 术语学习站:VibeHub
前端·ai·agent·独立开发·vibe coding
审小匠OpenCPAi4 小时前
银行流水核查怎么自动化?单边匹配、双向勾稽与图聚类异常检测的工程对比
java·前端·人工智能·python·审计
Revolution614 小时前
一个公共表格组件,是怎么一步步失控的
前端·前端工程化
腻害兔4 小时前
【若依项目-产品经理视角】RuoYi-Vue-Pro 源码拆解:CRM 客户关系模块深度解析——从线索到回款,一套完整的 B2B 销售闭环是怎么搭的?
java·前端·javascript·vue.js·产品经理·ai编程