什麼是package.json？

package.json是JavaScript項目的清單，該文件記錄了你的項目的名稱、版本、依賴等相關信息，同時它也是你將項目發佈到npm上的依據，可以説，package.json在前端模塊化時代，相當於項目的身份證，充分了解package.json的用户和含義是前端必備過程

初始化package.json

通過npm或者yarn指令可以快速創建package.json文件：

npm init -y
// or
yarn init -y

-y 表示創建默認的package.json,如果不使用-y，則會要求你主動填寫json內容。

默認文件內容：

{
  "name": "test",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "ISC"
}

package.json的配置

• name

項目名稱，必填字段，默認取的是當前項目的文件夾名字。

字段值限制：

1. 長度必須 <= 214個字符，只能包含小寫字母、'-'和'_'。如果項目要發佈到npm，必須符合該規範，即使不需要發佈到npm，我們仍應該準守這樣的規範，養成好習慣
2. 如果你的項目要發佈到npm，name就不能與已有的包名重複，在創建package.json之前，我們可以通過npm指令來檢查是否名字重複：

npm view package-name

package-name替換成自己的項目名，如果npm上存在對應的包，會返回該包的模塊信息，否則返回404

• version

項目版本號，格式為 主版本號.次版本號.修訂號，主版本號通常表示做了不兼容的API修改，次版本號通常表示做了向下兼容的的功能性新增，修訂號表示做了向下兼容的bug修復

如果版本改動比較大，運行不穩定，可以先發布先行版本，在常規版本號後面通過'-'連接標識符：內部版本（alpha）、公測版本（beta）和候選版本（rc），如：

'2.1.0.alpha'
'2.1.0-beta'
'2.1.0-rc'

先行版本後仍可接小版本後，表示不同的先行版本：

'2.1.0.alpha.1'
'2.1.0.alpha.5'

通過npm指令，可以查看線上npm包的最新版本以及版本記錄

// 查看最新版本
npm view package-name version

// 查看所有版本號
npm view package-name version

• description

項目的簡介，讓別人知道你的項目是用來做什麼的，這在你發佈到npm上時特別有用

• main

main指定了項目的入口文件，當你製作一個插件發佈到npm上後，別人通過import和require等方式導入你的項目時，導入的就是main指定的文件，如果不指定main字段，則會在導入時自動尋求根目錄下的 index.js、index.json等index命名的文件，如果沒有找到，導入就會報錯。

• scripts

定義項目node腳本，通過key-value的形式定義腳本名腳本執行內容，前端項目中通過 npm run xx 或 yarn xx 執行對應腳本。比如：npm run dev

比較少人知道的一種用法是：通過特殊的命名，可以達到命令前置、後續的操作，比如當你開發運行項目開發時，希望項目文檔服務先啓動，可以這樣實現：

{
    // ...
    "scripts": {
        "dev": "npm run server",
        "predev": "npm run docs"
    }
}

當你運行指令 npm run dev 時，其中 predev 指令會先執行完，如果你希望後續再執行其他指令，可以使用 postdev 命令名。

predevpostdev中的dev對應你的dev指令名

• keywords

項目的關鍵詞，有助於npm上的搜索

• author

項目作者，可以使用字符串，可以使用對象：

{
    "author": "landejin <1294619453@qq.com> (http://landejin.cn)"
}

{
    "author": {
        "name": "landejin",
        "email": "1294619453@qq.com",
        "url": "http://landejin.cn"
    }
}

• license

項目遵循的協議

• contributors

項目協作者，使用數組，和author一樣可以填寫字符串或者對象

{
    "contributors": [
        "landejin <1294619453@qq.com> (http://landejin.cn)"
    ]
}

• bugs

項目的的問題跟蹤器，一般可以鏈接到github的issues

{
  "bugs": "https://github.com/nodejscn/node-api-cn/issues"
}

• engines

項目運行的版本信息，該配置只起説明作用

{
    "engines": {
      "node": ">= 6.0.0",
      "npm": ">= 3.0.0",
      "yarn": "^0.13.0"
    }
}

• homepage

項目的主頁，通常是官方文檔之類的文檔

{
  "homepage": "http://nodejs.cn"
}

• private

聲明當前包是私有包，避免誤操作發佈到npm上

{
  "private": true
}

• dependencies

項目發佈運行所依賴的npm包，當使用 npm install xx 時，用依賴包會自動寫入該配置項

{
    "dependencies": {
      "vue": "^2.5.2"
    }
}

• devDependencies

項目開發時所依賴的npm包，寫在該配置的包表示只在開發過程中使用，而不會出現在線上的代碼中，比如ESLint、Less等

{
    "devDependencies": {
      "autoprefixer": "^7.1.2",
      "babel-core": "^6.22.1"
    }
}

• browserslist

用於標識項目支持的瀏覽器環境，babel、Autoprefixer和其他工具會用到該配置

"browserslist": [
  "> 1%",
  "last 2 versions",
  "not ie <= 8"
]

詳細的用户和配置可以參考： [https://www.npmjs.com/package...]

上面只列舉了常用的一些配置，package.json還有其他不常用的、或者特定環境下的配置，就不列舉了。