當(dāng)我們創(chuàng)建一個(gè) Node 項(xiàng)目時(shí)刁赖， 需要?jiǎng)?chuàng)建一個(gè) package.json 文件搁痛，描述這個(gè)項(xiàng)目所需要的各種模塊，以及項(xiàng)目的配置信息（比如名稱乾闰、版本落追、許可證等元數(shù)據(jù)）。
你可以在命令行使用 npm help package.json 命令涯肩，將跳轉(zhuǎn)到頁(yè)面，查看這些字段如何使用巢钓。下面將根據(jù)該文檔病苗，進(jìn)行整理。
字段信息
一般症汹，開(kāi)始一個(gè)項(xiàng)目時(shí)硫朦，我們會(huì)在命令行使用 npm init 命令生成 package.json 文件。
以下是 package.json 的一些字段信息：
name 項(xiàng)目名
{
"name": "node"
}
version 描述項(xiàng)目的當(dāng)前版本號(hào)
{
"version": "0.1.0"
}
description 項(xiàng)目的描述
{
"description": "My package"
}
main 指定項(xiàng)目的主入口文件
{
"main": "index.js"
}
author 項(xiàng)目作者信息背镇，貢獻(xiàn)者咬展。它可以有兩種寫(xiě)法。email 和 url 是可選的瞒斩。
// 方式一：
{
"name" : "lio-zero",
"email" : "licroning@163.com",
"url" : "http://www.reibang.com/u/3f644e66afa3"
}
// 方式二：
{
"author": "lio-zero <licroning@163.com> (http://www.reibang.com/u/3f644e66afa3)"
}
keywords 使用相關(guān)關(guān)鍵字描述項(xiàng)目
{
"keywords": ["admin", "node", "node"]
}
license 許可證（告訴用戶可以做什么和不能做什么破婆，常見(jiàn)：MIT、BSD-3-Clause）
{
"keywords": "MIT"
}
scripts 指定運(yùn)行腳本命令的 npm 命令行縮寫(xiě)胸囱，比如 start 指定了運(yùn)行 npm run start 時(shí)祷舀，所要執(zhí)行的命令。
{
"scripts": {
"start": "node ./bin/xxx"
}
}
repository 字段用于指定代碼存放的位置烹笔。
{
"repository": {
"type": "git",
"url": "這里寫(xiě)上項(xiàng)目在 github 上的地址"
}
}
您也可以添加 -y 標(biāo)志來(lái)生成默認(rèn)的 package.json 文件：
{
"name": "demo",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC"
}
使用 npm init -y 默認(rèn)生成的 package.json 文件會(huì)少一個(gè) repository 字段裳扯，需要的話可以手動(dòng)添加上去。
接下來(lái)我們將在這基礎(chǔ)上介紹一些其他字段谤职，他們都是可選的饰豺，也會(huì)在您使用某些 npm 命令時(shí)自動(dòng)生成。
依賴
dependencies 字段指定了生產(chǎn)環(huán)境項(xiàng)目的依賴允蜈。當(dāng)你添加生產(chǎn)環(huán)境依賴時(shí)冤吨，他會(huì)自動(dòng)生成，如：npm i express
{
"dependencies": {
"express": "^4.17.1"
}
}
devDependencies 字段指定了開(kāi)發(fā)環(huán)境項(xiàng)目的依賴陷寝。當(dāng)你添加生產(chǎn)環(huán)境依賴時(shí)锅很，他會(huì)自動(dòng)生成，如：npm i eslint -D
{
"devDependencies": {
"eslint": "^6.7.2"
}
}
peerDependencies 兼容性依賴凤跑。如果你的包是插件爆安，適合這種方式。
{
"peerDependencies": {
"tea": "2.x"
},
}
optionalDependencies 如果你想在某些依賴即使沒(méi)有找到仔引，或則安裝失敗的情況下扔仓，npm 都繼續(xù)執(zhí)行褐奥。那么這些依賴適合放在這里。
{
"optionalDependencies": {},
}
bundledDependencies 發(fā)布包時(shí)捆綁的包名數(shù)組
{
"bundledDependencies": ["renderized", "super-streams"]
}
配置
config 字段中的鍵作為 env 環(huán)境變量公開(kāi)給腳本翘簇。
{
"name": "node",
"config": {
"foo": "hello"
}
}
你可以在應(yīng)用程序中使用 config 字段撬码，當(dāng)用戶執(zhí)行 npm run start 命令時(shí)，這個(gè)腳本就可以得到值版保。
console.log(process.env.npm_package_config_foo)
你可以使用下面命令改變這個(gè)值呜笑。
$ npm config set node:foo hi
lint-staged
在代碼提交之前，進(jìn)行代碼規(guī)則檢查能夠確保進(jìn)入 git 庫(kù)的代碼都是符合代碼規(guī)則的彻犁。但是整個(gè)項(xiàng)目上運(yùn)行 lint 速度會(huì)很慢叫胁，lint-staged 能夠讓 lint 只檢測(cè)暫存區(qū)的文件，所以速度很快汞幢。
安裝與配置
husky 和 lint-staged
$ npm i husky lint-staged -D
package.json 中配置：
{
"husky": {
"hooks": {
"pre-commit": "lint-staged"
}
},
"lint-staged": {
"*.js": "eslint --fix"
}
}
git commit 時(shí)觸發(fā) pre-commit 鉤子驼鹅，運(yùn)行 lint-staged 命令，對(duì) *.js 執(zhí)行 eslint 命令森篷。eslint 要提前配置好输钩。
其他
homepage 項(xiàng)目首頁(yè)的網(wǎng)址。
{
"homepage": "http://www.reibang.com/u/3f644e66afa3"
}
bugs 項(xiàng)目的問(wèn)題追蹤系統(tǒng)的 URL 或郵箱地址仲智，這些對(duì)遇到軟件包問(wèn)題的人很有幫助买乃。
{
"bugs": {
"url" :"http://github.com/owner/project/issues",
"email" :"project@hostname.com"
}
}
bin 很多的包都會(huì)有執(zhí)行文件需要安裝到 PATH 中去。這個(gè)字段對(duì)應(yīng)的是一個(gè) Map坎藐，每個(gè)元素對(duì)應(yīng)一個(gè){ 命令名：文件名 }为牍。這些可執(zhí)行文件的頭部需要加上 #!/usr/bin/env node。
{
"bin": {
"npm": "./cli.js",
"command": "./bin/command"
}
}
private 是一個(gè)布爾值岩馍。如果 private 為 true碉咆，可以保證包不會(huì)被發(fā)布到 npm。這可以防止私有 repositories 不小心被發(fā)布出去蛀恩。
preferGlobal 是一個(gè)布爾值疫铜。如果你的包是個(gè)命令行應(yīng)用程序，需要全局安裝双谆，就可以設(shè)為 true壳咕。
{
"private": true,
"preferGlobal": true
}
browserslist 指定項(xiàng)目所支持的瀏覽器版本。
{
"browserslist": [
"last 3 Chrome versions",
"last 3 Firefox versions",
"Safari >= 10",
"Explorer >= 11",
]
}
engines 字段指明了該項(xiàng)目運(yùn)行的平臺(tái)顽馋，比如 Node 的某個(gè)版本或者瀏覽器谓厘，也可以指定適用的 npm 版本。
{
"engines": {
"node": ">= 12.16.2",
"npm": ">= 6.14.8"
},
}
man 用來(lái)指定當(dāng)前項(xiàng)目的 man 文檔的位置寸谜。
{
"man" :[ "./doc/calc.1" ]
}
style 指定供瀏覽器使用時(shí)竟稳，樣式文件所在的位置。樣式文件打包工具 parcelify，通過(guò)它知道樣式文件的打包位置他爸。
{
"style": [
"./node_modules/tipso/src/tipso.css"
]
}
cpu 指定 CPU 型號(hào)聂宾。
{
"cpu" : [ "x64", "ia32" ],
"cpu" : [ "!arm","!mips" ]
}
os 指定項(xiàng)目可以在什么操作系統(tǒng)上運(yùn)行。
{
"os" : [ "darwin","linux" ],
}
files 當(dāng)你發(fā)布項(xiàng)目時(shí)诊笤，具體哪些文件會(huì)發(fā)布上去系谐。如果需要把某些文件不包含在項(xiàng)目中，添加一個(gè) .npmignore 文件讨跟。這個(gè)文件和 gitignore 類似纪他。
{
"files": [
"src",
"dist/*.js",
"types/*.d.ts"
],
}
publishConfig 是一個(gè)布爾值。如果你的包是個(gè)命令行應(yīng)用程序晾匠，需要全局安裝止喷，就可以設(shè)為 true。
engineStrick 是一個(gè)布爾值混聊。如果你肯定你的程序只能在制定的 engine 上運(yùn)行，設(shè)置為 true乾巧。
還有一些特殊的字段句喜，比如 prettier、unpkg沟于、babel咳胃、jest 等，他們配合工具使用旷太。
根據(jù) package.json 內(nèi)容自動(dòng)生成 README.md 文件
對(duì)于任何開(kāi)源項(xiàng)目來(lái)說(shuō)展懈，最重要的文檔就是 README。
這里介紹一個(gè)好用的工具 readme-md-generator供璧，它將根據(jù) package.json 文件內(nèi)容自動(dòng)生成漂亮 README文件
readme-md-generator 能夠讀取您的環(huán)境（package.json存崖，git 配置等），創(chuàng)建項(xiàng)目的 README 文件睡毒。
以下是該模式提供的一個(gè)示例演示：
基本配置
確保已安裝 npx（自 npm 以來(lái)默認(rèn) npx 5.2.0)
只需在項(xiàng)目根部運(yùn)行以下命令并回答問(wèn)題：
$ npx readme-md-generator
或使用 -y 標(biāo)志默認(rèn)生成：
$ npx readme-md-generator -y
假設(shè)我們有如下配置：
{
"name": "vue3",
"version": "0.1.0",
"private": true,
"description": "vue3-demo",
"author": "lio-zero <licroning@163.com>",
"license": "MIT",
"engines": {
"node": ">= 12.16.2",
"npm": ">= 6.14.8"
},
"repository": {
"type": "git",
"url": "git+https://github.com/lio-zero/vue3.git"
},
"homepage": "https://github.com/lio-zero/vue3.git#readme",
"keywords": [
"vue3",
"cli"
],
"scripts": {},
"dependencies": {},
"devDependencies": {}
}
效果如下：
詳細(xì)內(nèi)容可以查閱文檔来惧，例如可以單獨(dú)定制模板等。
