Package.json 文件解释!!!

2025-05-25

Package.json 文件解释!!!

如果您一直在从事 javascript 或相关框架项目,那么您肯定会遇到名为 package.json 的文件,我们可能很好奇为什么这个文件包含在我们的项目中以及为什么需要它🤔。

该文件的主要目的是保存与项目相关的各种元数据,并用于向 npm 提供信息,以识别项目及其依赖项。

要手动创建 package.json 文件,您需要运行一个命令,npm init该命令会询问您一些非强制性的问题。只需按 Enter 键即可完成这些问题。您可以稍后更改。
如果您确实想回答这些问题,可以运行一个命令,npm init -y该命令将使用默认设置创建一个名为 package.json 的文件。

让我们看看 npm 为我们在此文件中提供的可用选项列表。

名称
如果您在本地开发了一些项目,并计划发布它们。
名称和版本是两个重要的参数。两者都是必需的,并且必须是唯一的。
名称代表您的项目名称。
定义名称有一些规则。

  1. 必须小于或等于 214 个字符
  2. 不应以点 (.) 或下划线 (_) 开头。
  3. 名称中不应包含大写字母。
  4. 包名称不能包含任何非 URL 安全字符(因为名称最终成为 URL 的一部分)请通过此链接查找不安全字符。
  5. 如果需要,您可以检查 npm 注册表该名称是否可用。

version
此属性定义项目的版本,并且应遵循语义版本控制指南
示例

"version": "1.0.0"
Enter fullscreen mode Exit fullscreen mode

描述
此属性用于提供有关项目的更多信息,并帮助人们在 npm 搜索中发现您的包。
示例

"description": "A package to work with strings"
Enter fullscreen mode Exit fullscreen mode

关键字:
这是一个字符串数组,其中包含与你的项目相关的关键字。这有助于人们根据关键字搜索找到你的软件包。
示例

"keywords": [
  "react",
  "Javascript"
]
Enter fullscreen mode Exit fullscreen mode

homepage
此属性用于提供项目的登录页面 URL。
示例

"homepage": "https://github.com/owner/project#readme"
Enter fullscreen mode Exit fullscreen mode

许可证
此属性表示项目中的许可证类型,该包是否可以被其他人无限制地使用。要了解有关许可证的更多信息

bugs
此属性用于指定项目问题跟踪器和/或问题报告的电子邮件地址。这些属性将帮助那些在使用你的软件包时遇到问题的人。
例如:

"bugs":{
  "url" : "https://github.com/owner/project/issues",
  "email" : "project@hostname.com"
}
Enter fullscreen mode Exit fullscreen mode

人员字段:author、contributors
此属性指定参与开发此项目的贡献者数量。Author
表示单个人员,而 contributors 表示人员数组。
示例:

"author": "abc@example.com https://www.abc.com/",
"contributors": [{
    "name": "example",
    "email": "example@example.com",
    "url": "https://www.example.com/#team"
}]
(email and url are optional).
Enter fullscreen mode Exit fullscreen mode

scripts
此属性包含在包生命周期中不同时间点运行的命令。它接受一个对象,其键是脚本,我们可以用它(npm run )执行这些脚本,值是我们在值中指定的各种命令。键是生命周期事件,值是在该时间点运行的命令。
例如:

"scripts":{
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject",
    "lint": "eslint ./"
}
Enter fullscreen mode Exit fullscreen mode

这些主要是终端命令,可以帮助我们执行开发过程中使用的特定任务。了解更多关于npm scripts 的信息

dependency
这是文件中最重要的键之一,也是使用此文件的全部原因。本项目中使用的所有依赖项(通过 CLI 安装的各种 npm 库)都列在这里。当使用 npm install 命令安装包时,安装完成后,它将自动添加到 dependency 键下。
例如:

"dependencies": {
 "react": "^17.0.1",
 "react-router-dom": "^5.2.0",
 "compression": "~1.7.4"
}
Enter fullscreen mode Exit fullscreen mode

注意:
依赖版本中的 ~ 和 ^ 是semver中定义的版本范围的符号,因为它遵循语义版本控制。

devDependencies 中
有一些软件包仅在开发过程中需要,生产环境则不需要。这些软件包可以列在这里。例如 eslint 或 nodemon。这些软件包是我们在开发过程中会用到的。
要将软件包安装为 devDependency,请运行

npm install --save-dev <packagename>
Enter fullscreen mode Exit fullscreen mode

private
此属性为 true 或 false。如果设置为 true,npm 将拒绝发布。
例如:

"private": true
Enter fullscreen mode Exit fullscreen mode

引擎
此属性设置项目应在哪些版本的 Node 和其他命令上运行。
例如:

"engines": {
  "node": ">= 6.0.0",
  "npm": ">= 3.0.0",
  "yarn": "^0.13.0"
}
Enter fullscreen mode Exit fullscreen mode

browserslist
此属性指定您希望哪个浏览器(以及版本)支持您的项目。如果您正在使用最新的 ES 功能,我们需要确保所有浏览器都支持它,否则需要 fallback/polyfills。Babel、Autoprefixer 和其他工具都会引用它。要将所需的 polyfills 和 fallbacks 添加到您的目标浏览器。
您可以在此处检查浏览器是否已支持最新功能。

例子:

"browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
Enter fullscreen mode Exit fullscreen mode

注意:
0.2% 表示您希望支持至少占全球使用量 0.2% 的浏览器。not
dead 表示排除过去 24 个月内未获得官方支持的浏览器。
您可以点击此处了解更多关于 browserslist 的信息。

main
此属性指定项目的入口点。如果有人安装了你的项目,然后使用import something from 'something',则你在此键中指定的文件将被导入。
如果未指定任何内容,则默认设置为 index.js。
例如:

"main": "src/main.js"
Enter fullscreen mode Exit fullscreen mode

package.json 文件是所有 JavaScript/Node 项目的核心。并非所有属性都适用于您的项目,但我们可以利用这些属性来实现一些强大的功能。了解 package.json 文件的作用是 JavaScript 生态系统的重要组成部分,它将使您更加深入地理解 JavaScript 生态系统!🙂

感谢阅读,祝您拥有美好的一天😃。
我们下篇文章再见😉。

文章来源:https://dev.to/naveenchandar/package-json-file-explained-b94
PREV
JavaScript 中的闭包是什么?
NEXT
JavaScript 提升