# package.json 文件

一般前端工作, 无论是npm还是yarn都绕不开包管理以及package.json文件, 奈何这么多年都很少想起来看他, 虽然大概都知道配置项是干嘛的 ,不过还是花个时间再大致总结一下。

每个项目的根目录下面,一般都有一个package.json文件,定义了这个项目所需要的各种模块,以及项目的配置信息(比如名称、版本、许可证等元数据)。npm install命令根据这个配置文件,自动下载所需的模块,也就是配置项目所需的运行和开发环境。package.json文件就是一个JSON对象

# name

项目名称,发布项目的时候这个是必须的

# version

项目版本,遵守“大版本.次要版本.小版本”的格式。 发布项目的时候这个是必须的

{
    version: "0.1.1"
}

# scripts字段

scripts指定了运行脚本命令的npm命令行缩写

{
  "scripts": {
    "dev": "vuepress dev docs",
    "build": "vuepress build docs"
  }
}

npm_scripts (opens new window)

  1. 并行执行可以使用 &
  2. 串行执行可以使用 &&
{
  "scripts": {
    "dev": "node index.js & vuepress dev docs",
    "build": "node index.js && vuepress build docs"
  }
}

# dependencies、devDependencies

dependencies字段指定了项目运行所依赖的模块,devDependencies指定项目开发所需要的模块。它们都指向一个对象。该对象的各个成员,分别由模块名和对应的版本要求组成,表示依赖的模块及其版本范围。

依赖版本格式

  1. "1.2.2"指定版本, 只安装这个版本的依赖
  2. "~1.2.2" 安装版本 大于1.2.2 但是小于1.3.x
  3. "^1.2.2"安装版本 大于1.2.2 但是小于2.0.0
  4. latest 安装最新版本

# peerDependencies

就是用来供插件指定其所需要的主工具的版本。

# bin

"bin": {
  "cli-service": "./bin/service.js"
}

bin项用来指定各个内部命令对应的可执行文件的位置。

上面代码指定,cli-service 命令对应的可执行文件为 bin 子目录下的 service.js。Npm会寻找这个文件,在node_modules/.bin/目录下建立符号链接。在上面的例子中,service.js会建立符号链接node_modules/.bin/cli-service。由于node_modules/.bin/目录会在运行时加入系统的PATH变量,因此在运行npm时,就可以不带路径,直接通过命令来调用这些脚本。

因此可以简写

"scripts": {  
  "start": "./node_modules/bin/service.js --mode dev"
}

// 简写为

"scripts": {  
  "start": "service --mode dev"
}

所有node_modules/.bin/目录下的命令,都可以用npm run [命令]的格式运行。在命令行下,键入npm run,然后按tab键,就会显示所有可以使用的命令。

# main字段

main字段指定了加载的入口文件,require('moduleName')就会加载这个文件。这个字段的默认值是模块根目录下面的index.js

# config 字段

config字段用于添加命令行的环境变量。

比如下面的配置

{
    "name": "test",
    "consfig": {
        "port": 8081
    },
    "script": {
        "start": "node server.js"
    }
}

可以在server.js中获取到变量

server.listen(process.env.npm_package_config_port)

# 其他字段

# browser

browser指定该模板供浏览器使用的版本。Browserify这样的浏览器打包工具,通过它就知道该打包那个文件。

# engines 字段

{ "engines" : { "node" : ">=0.10.3 <0.12" } }

# man字段

man用来指定当前模块的man文档的位置。

# preferGlobal

preferGlobal的值是布尔值,表示当用户不将该模块安装为全局模块时(即不用–global参数),要不要显示警告,表示该模块的本意就是安装为全局模块。

# style

style指定供浏览器使用时,样式文件所在的位置。样式文件打包工具parcelify,通过它知道样式文件的打包位置。

# description

表示项目的一些简短描述内容

# keywords

此属性包含与软件包功能相关的关键字数组。

# private

private 如果设置为 true,则可以防止应用程序/软件包被意外地发布到 npm

# author

列出项目的作者名称,值可以是字符串, 也可以是对象

{
    "author": {
        "name": "project author",
        "email": "xxx@xxx.com",
        "url": "www.xxx.com"
    }
}

# contributors

除作者外的贡献者

# bugs

链接到软件包的问题跟踪器,最常用的是 GitHub 的 issues 页面。

# homepage

设置软件包的主页。

# license

指定软件包的许可证。

# repository

此属性指定了此程序包仓库所在的位置。

# funding

可以指定一个包含 URL 的对象或者一个URL,该 URL 提供有关帮助资助开发包的方法的最新信息,

# 命令特有的属性

package.json 文件还可以承载命令特有的配置,例如 Babel、ESLint、Git 等。

 "gitHooks": {
    "pre-commit": "lint-staged"
  },
  "lint-staged": {
    "linters": {
      "*.{ts,vue}": [
        "npm run prettier:write",
        "vue-cli-service lint",
        "npm run lint:es",
        "git add"
      ],
      "*.js": [
        "npm run lint:es",
        "git add"
      ]
    },
    "ignore": [
      "deprecated/**/*.ts"
    ]
  }
上次更新: 1/22/2025, 9:39:13 AM