一文帶你了解nodejs中的package.json

這篇文章帶大家了解一下Node.js專案中package.json文件，看看它的功能、創建方法，了解如何管理package.json，以及package.json和package-lock .json的區別。

隨著前端工程化、自動化的發展，模組化開發已經成為當下前端的一種潮流，而在一個完整的Node.js專案中，package.json 檔案無所不在。首先，在專案根目錄會有，其次在 node_modules 中也頻現。那麼這個文件到底是幹嘛的，又有什麼作用，今天要給大家揭曉。 【推薦學習：《nodejs 教學》】

package.json 檔案作用

我們在建立 Node.js專案的時候，會遇到 package.json 檔案。它是一個 JSON 文件，位於專案的根目錄下。

package.json 包含關於專案的重要資訊。它包含關於專案的使人類可讀元資料（如專案名稱和說明）以及功能元資料（如套件版本號和程式所需的依賴項清單），要徹底搞懂package.json，我們還得從Node.js的模組（Module）講起。

在Node.js中，模組可以是一個函式庫或框架，也可以是Node.js項目，Node.js項目遵循模組化架構，當我們建立一個Node.js項目的時，這些模組的描述檔稱為package.json檔案。

package.json是Node.js專案中非常重要的配置文件，是專案的核心，該檔案中追蹤依賴關係和元數據，定義了當前專案所需的各種模組，以及專案的設定訊息，是專案或模組包的描述，裡麵包含許多元資訊。

其定義了執行專案所需的各種依賴和專案的設定資訊（例如專案名稱、專案版本、專案執行入口檔案、執行的腳本、依賴的插件、專案貢獻者、許可證以及運行、開發以及選擇性地將專案發佈到npm 所需的資訊。）。

它是配置和描述如何與程式互動和運行的中心,npm和yarn用它來識別你的專案並了解如何處理專案的依賴關係。 

npm cli 也是管理 package.json 的最佳方法，因為它有助於在專案的整個生命週期中產生和更新 package.json 檔案。 package.json檔案就是一個JSON對象，而這個物件的每個成員就是目前專案的一個設定。

package.json 會在專案的生命週期中扮演多個角色，其中某些角色只適用於發佈到npm的軟體包，可以啟動你的專案、運行腳本、安裝依賴項、發佈到npm註冊表以及許多其他有用的任務。 。即使你沒有把專案發佈到 npm註冊表中，或者沒有將其公開發布給其他人，那麼 package.json 對於開發流程仍然至關重要。

你的專案也必須包含 package.json，然後才能從 npm安裝軟體套件。這也是專案中需要它的主要原因之一。

npm install 指令會根據這個檔案下載所有依賴模組。 package.json一般都在專案的根目錄下。

package.json 檔案建立

package.json 檔案建立有兩種方式，手動建立和自動建立，一般我們使用自動建立較多。

1、手動建立

建立專案目錄

$mkdir node-demo>cd node-demo>touch package.json

直接在專案根目錄下新建一個package.json 文件，然後輸入相關的內容。

{
  "name": "express-admin",
  "version": "1.0.0",
  "description": "Express Admin",
  "keywords": [
    "server",
    "express",
    "compression"
  ],
  "homepage":"https://gitee.com/xunzhaotech/express-admin.git",
  "bugs":"https://github.com/owner/project/issues",
  "license": "MIT",
  "author": {
    "name": "Amber luyb",
    "email": "luyb@xunzhaotech.com",
    "url": "https://www.xunzhaotech.com"
  },
  "contributors": [
    {
      "name": "Amber luyb",
      "email": "luyb@xunzhaotech.com",
      "url": "https://gitee.com/xunzhaotech/express-admin.git"
    }
  ],
  "funding": [
    {
      "type" : "individual",
      "url" : "http://example.com/donate"
    },
    "http://example.com/donateAlso",
    {
      "type" : "patreon",
      "url" : "https://www.patreon.com/my-account"
    }
  ],
  "files":[".git",
    "CVS",
    ".svn",
    ".hg",
    ".lock-wscript",
    ".wafpickle-N",
    ".*.swp",
    ".DS_Store",
    "._*",
    "npm-debug.log",
    ".npmrc",
    "node_modules",
    "config.gypi",
    "*.orig,"],
  "main": "index.js",
  "browser":"",
  "bin": {
    "myapp": "./cli.js"
  },
  "man": [
    "./man/foo.1",
    "./man/bar.1"
  ],
  "repository": {
    "type": "git",
    "url": "https://gitee.com/xunzhaotech/express-admin.git"
  },
  "scripts": {
    "docs:dev": "vuepress dev docs",
    "docs:build": "vuepress build docs",
    "server": "node server.js",
    "start": "node index.js",
    "dev": "nodemon",
    "lint": "eslint **/*.js"
  },
  "config": {
    "port": "8080"
  },
  "devDependencies": {
    "eslint": "^7.22.0",
    "mockjs": "^1.1.0",
    "nodemon": "^2.0.7",
    "vuepress": "^1.8.2"
  },
  "dependencies": {
    "body-parser": "^1.19.0",
    "compression": "^1.7.4",
    "cookie-parser": "^1.4.5",
    "debug": "^4.3.1",
    "express": "^4.17.1",
    "express-session": "^1.17.1"
  },
  "peerDependencies": {
    "tea": "2.x"
  },
  "peerDependenciesMeta": {
    "soy-milk": {
      "optional": true
    }
  },
  "bundledDependencies": [
    "renderized",
    "super-streams"
  ],
  "optionalDependencies":{},
  "engines": {
    "npm": "~1.0.20"
  },
  "os": [
    "darwin",
    "linux"
  ],
  "cpu": [
    "!arm",
    "!mips"
  ],
  "private": false,
  "publishConfig":{},
  "workspaces": [
    "./packages/*"
  ]
}

2、自動建立

當我們新建一個名稱為xz-nuxt-admin， 在專案根目錄下執行yarn init -y 或npm init -y 指令後，也可以輸入npm init或yarn init -y這個指令採用互動方式，要求使用者回答一些問題，然後根據提示一步步輸入對應的內容完成後即可在專案目錄下會新增一個基本的package.json檔案。在所有問題之中，只有項目名稱（name）和項目版本（version）是必填的，其他都是選填的。內容如下：

{
 "name": "my-test",   # 项目名称
  "version": "1.0.0", # 项目版本（格式：大版本.次要版本.小版本）
  "author": "",       # 作者
  "description": "",  # 项目描述
  "main": "index.js", # 入口文件
  "scripts": {        # 指定运行脚本命令的 npm 命令行缩写
      "test": "echo \"Error: no test specified\" && exit 1"
  },
"keywords": [],       # 关键词
"license": "ISC"      # 许可证
}

package.json 檔案配置說明

#我們知道package.json 中包含的一些最常見和重要的字段，用來管理專案的設定資訊或發佈到npm，而其他一些則可以幫助npm CLI 運行應用程式或安裝相依性。實際的字段比我們所介紹的要多，你可以在它的文檔中了解其餘字段，但以下的是必須要了解的 package.json 屬性。

1、必须字段

package.json 中有非常多的配置项，其中必须填写的两个字段分别是 name 字段和 version 字段，它们是组成一个 npm 模块的唯一标识。

name

name 字段定义了模块的名称，其命名时需要遵循官方的一些规范和建议：

• 项目/模块名称，长度必须小于等于214个字符，不能以"."(点)或者"_"(下划线)开头，不能包含大写字母。
• 模块名会成为模块 url、命令行中的一个参数或者一个文件夹名称，任何非 url 安全的字符在模块名中都不能使用（我们可以使用 validate-npm-package-name 包来检测模块名是否合法）。
• 语义化模块名，可以帮助开发者更快的找到需要的模块，并且避免意外获取错误的模块；
• 若模块名称中存在一些符号，将符号去除后不得与现有的模块名重复。

name 字段不能与其他模块名重复，我们可以执行以下命令查看模块名是否已经被使用：npm view <packagename></packagename>或者，我们也可以去 npm 上输入模块名，如果搜不到，则可以使用该模块名。

version

• 在package.json文件中，版本是非常重要的一个概念，npm 包中的模块版本都需要遵循 SemVer 规范，该规范的标准版本号采用 X.Y.Z 的格式，其中 X、Y 和 Z 均为非负的整数，且禁止在数字前方补零：
• X 是主版本号(major)：第一位就是主要版本号。一般来说，重大功能的更新，或功能的添加又不能向后兼容的情况会提升该版本号。
• Y 是次版本号(minor)：中间那一位是指次要版本号。一般来说，一些功能的添加，但又能向后兼容，这种更新会提升该版本号。
• Z 是修订号(patch)：最后一位就是补丁版本号。一般来说，如果是项目的一些BUG修复，会将该版本号提升。

当某个版本改动比较大、并非稳定而且可能无法满足预期的兼容性需求时，我们可能要先发布一个先行版本。

先行版本号可以加到主版本号.次版本号.修订号的后面，通过 - 号连接一连串以句点分隔的标识符和版本编译信息：

• 内部版本(alpha)
• 公测版本(beta)
• 正式版本的候选版本rc（即 Release candiate）

我们可以执行以下命令查看模块的版本：

$npm view <packageName> version  # 查看某个模块的最新版本
$npm view <packageName> versions # 查看某个模块的所有历史版本

2、可选字段

可选字段是除去必填字段需要补充的项目信息

描述信息（description & keywords）

• description：字段用于添加模块的描述信息，便于用户了解该模块，是一个字符串。它可以帮助人们在使用npm search时找到这个包。
• keywords 项目关键字，是一个字符串数组。用于给模块添加关键字。它可以帮助人们在使用npm search时找到这个包。
• 当我们使用 npm 检索模块时，会对模块中的 description 字段和 keywords 字段进行匹配，写好 package.json中的 description 和 keywords 将有利于增加我们模块的曝光率。

安装项目依赖（dependencies & devDependencies）

• dependencies：字段指定了项目运行所依赖的模块（生产环境下，项目运行所需依赖）。
• devDependencies：指定项目开发所需要的模块（开发环境下，项目所需依赖）。

说明：

我们在使用vue框架开发一个程序，开发阶段需要用到webpack来构建你的开发和本地运行环境。所以vue一定要放到dependencies里，因为以后程序到生产环境也要用。webpack则是你用来压缩代码，打包等需要的工具，程序实际运行的时候并不需要，所以放到devDependencies里就可以了。或者我们在写程序要用ES6标准，浏览器并不完全支持，所以你要用到babel来转换代码，babel放devDependencies。程序里有用到开源组件，比如你想用antd，antd要放dependencies。

简化终端命令（scripts）

scripts 字段是 package.json 中的一种元数据功能，它接受一个对象，对象的属性为可以通过 npm run 运行的脚本，值为实际运行的命令（通常是终端命令），如：

  "scripts": {
     "dev": "nuxt",
     "build": "nuxt build",
     "start": "nuxt start",
     "generate": "nuxt generate"
 },

将终端命令放入 scripts 字段，既可以记录它们又可以实现轻松重用。

定义项目入口（main）

main 字段是 package.json 中的另一种元数据功能，它可以用来指定加载的入口文件。假如你的项目是一个 npm 包，当用户安装你的包后，const ModuleName = require('module-name') 返回的是 main 字段中所列出文件的 module.exports 属性。当不指定main 字段时，默认值是模块根目录下面的index.js 文件。

发布文件配置（files）

files 字段用于描述我们使用 npm publish 命令后推送到 npm 服务器的文件列表，如果指定文件夹，则文件夹内的所有内容都会包含进来。我们可以查看下载的 antd 的 package.json 的files 字段，内容如下：

"files": [
   "dist",
   "lib",
   "es"
    ……
],

可以看到下载后的 antd 包是下面的目录结构中包含了  /dist/"lib/es文件，另外，我们还可以通过配置一个 .npmignore 文件来排除一些文件， 防止大量的垃圾文件推送到 npm 上。

定义私有模块（private）

一般公司的非开源项目，都会设置 private 属性的值为 true，这是因为 npm 拒绝发布私有模块，通过设置该字段可以防止私有模块被无意间发布出去。

指定模块适用系统（os）

使用 os 属性可以指定模块适用系统的系统，或者指定不能安装的系统黑名单（当在系统黑名单中的系统中安装模块则会报错）

"os" : [ "darwin", "linux" ] # 适用系统
"os" : [ "!win32" ] # 黑名单

在 node 环境下可以使用 process.platform 来判断操作系统

指定模块适用 cpu 架构（cpu）

我们可以用 cpu 字段更精准的限制用户安装环境

"cpu" : [ "x64", "ia32" ] # 适用 cpu
"cpu" : [ "!arm", "!mips" ] # 黑名单

在 node 环境下可以使用 process.arch 来判断 cpu 架构

指定项目 node 版本（engines）

防止因node 版本不同，导致会出现很多奇奇怪怪的问题（如某些依赖安装报错、依赖安装完项目跑不起来等）。

"engines": {
  "node": ">= 8.16.0",
  "npm": ">= 6.9.0"
},

需要注意的是，engines属性仅起到一个说明的作用，当用户版本不符合指定值时也不影响依赖的安装

自定义命令（bin）

bin 字段用来指定各个内部命令对应的可执行文件的位置。主要应用在脚手架搭建中，当package.json 提供了 bin 字段后，即相当于做了一个命令名和本地文件名的映射。 当用户安装带有 bin 字段的包时，

• 如果是全局安装，npm 将会使用符号链接把这些文件链接到/usr/local/node_modules/.bin/；
• 如果是本地安装，会链接到./node_modules/.bin/。

如果要使用 mfd-cli 作为命令时，可以配置以下 bin 字段：

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

上面代码指定，mfd-cli 命令对应的可执行文件为 bin 子目录下的 cli.js，因此在安装了 mfd-cli 包的项目中，就可以很方便地利用 npm执行脚本：

"scripts": {
    start: 'node node_modules/.bin/mfd-cli'
 }

这里看起来和 vue create/create-react-app之类的命令不太一样？是因为：当需要 node 环境时就需要加上 node 前缀如果加上 node 前缀，就需要指定mfd-cli 的路径 -> node_modules/.bin，否则 node mfd-cli会去查找当前路径下的 mfd-cli.js，这样肯定是不对。若要实现像 vue create/create-react-app之类的命令一样简便的方式，则可以在上文提到的 bin 子目录下可执行文件cli.js 中的第一行写入以下命令：#!/usr/bin/env node这行命令的作用是告诉系统用 node 解析，这样命令就可以简写成 mfd-cli 了。

设置应用根路径（homepage）

当我们使用 create-react-app 脚手架搭建的 React 项目，默认是使用内置的 webpack 配置，当package.json 中不配置 homepage 属性时，build 打包之后的文件资源应用路径默认是/。

一般来说，我们打包的静态资源会部署在 CDN 上，为了让我们的应用知道去哪里加载资源，则需要我们设置一个根路径，这时可以通过 package.json 中的 homepage 字段设置应用的根路径。

当我们设置了 homepage 属性后：

{
    "homepage": "https://xxxx.cdn/project-name",
}

打包后的资源路径就会加上 homepage 的地址：/project-name/bundle.js

其它配置

• author：專案開發者，它的值是你在npmjs.org網站的有效帳號名，遵循「帳號名稱 」的規則，例如：xunzhaotech@aliyun.com。
• private：是否有私有，當設定為 true 時，npm 拒絕發布。
• license：軟體授權條款，讓使用者知道他們的使用權利和限制。
• bugs：bug 提交地址。
• contributors：專案貢獻者 。
• repository：專案倉庫位址。
• module：是以ES Module(也就是ES6)模組化方式進行加載，因為早期沒有ES6 模組化方案時，都是遵循CommonJS 規範，而CommonJS 規範的套件是以main 的方式表示入口文件的，為了區分就新增了module 方式，但是ES6 模組化方案效率更高，所以會優先查看是否有module 字段，沒有才使用main 字段。
• eslintConfig：EsLint 檢查檔案配置，自動讀取驗證。
• browserslist：瀏覽器使用的版本清單。
• style：瀏覽器使用時，樣式檔案所在的位置；樣式檔案打包工具parcelify，透過它知道樣式檔案的打包位置。

package.json和package-lock.json的差別

為什麼有了package.json，還需要package-lock.json檔案呢，當node_modules資料夾並不存在或被刪除時，需要用到npm install重新裝載全部依賴時，透過package-lock.json可以直接表明下載地址和相關依賴，相對下載速度也更快，也不容易報錯。

更多程式相關知識，請造訪：程式設計影片！ ！

以上是一文帶你了解nodejs中的package.json的詳細內容。更多資訊請關注PHP中文網其他相關文章！