1、什么是package.json
package.json文件是Node.js項目中的一個描述文件，執行npm init命令初始化項目后，在項目的根目錄下自動生成該文件。package.json包含了項目的配置信息以及項目所需的各種模塊，使用npm install（簡寫：npm i）命令后會自動根據package.json下載所需的模塊。基本信息如下：
{
"name": "test",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"dependencies": { }
}
2、package.json的屬性說明
- name：名稱
- version：版本
- description：描述
- main：npm包項目的主要入口文件，必須的
- module：打包需要的入口文件
- typings：TypeScript 的入口文件
- files: 發布package時，控制哪些文件會發布上去，如：
"files": ["src","dist/*.js","types/*.d.ts"] - gitHooks：代碼質量檢查，如：
"gitHooks": {"pre-commit": "lint-staged","commit-msg": "node scripts/verify-commit-msg.js"} - scripts：啟動腳本，一般較長的命令可以設置腳本啟動，詳情請看2.1
- repository：git倉庫所在位置，如：
"repository": {"type": "git","url": "git+https://github.com/ForeverS2C"} - keywords：關鍵字
- author：作者
- license：開源協議
- bugs：bug地址
- homepage：主頁
- devDependencies：項目依賴，詳情請看2.2
- config：設置一些用於npm包的腳本命令會用到的配置參數
- peerDependencies：其他依賴包，詳情請看2.3
- engines：指定項目所需要的node.js版本，如：
"engines": {"node": ">=8.9.1","npm": ">=5.5.1","yarn": ">=1.3.2"} - browserslist：支持的瀏覽器，如：
"browserslist": ["last 3 Chrome versions","last 3 Firefox versions","Safari >= 10","Explorer >= 11","Edge >= 12","iOS >= 10","Android >= 6"]
2.1、scripts
scripts可以簡單的理解為：自定義腳本命令，在命令行中通過執行npm run+變量來執行這段腳本
-
原理：
使用npm run script執行腳本的時候都會創建一個shell，然后在shell中執行指定的腳本。這個shell會將當前項目的可執行依賴目錄（node_modules/.bin）添加到環境變量path中，當執行之后之后再恢復原樣。也就是說腳本命令中的依賴名會直接找到node_modules/.bin下面的對應腳本，而不需要加上路徑。
-
使用：
npm run + 變量名稱
如上圖中，即可用npm run dev || npm run start || npm start來啟動項目 -
四個可以簡寫的腳本執行命令
npm start === npm run start
npm stop === npm run stop
npm test === npm run test
npm restart === npm run stop && npm run restart && npm run start
2.2、dependencies和devDependencies
執行npm i的時候會自動將兩者引入的依賴下載到node_modules下。這兩者的區別就在於項目開發和運行時，如何安裝所需要的依賴。我們的項目分為生產環境和開發環境，一般說的“項目上線”，就是打包開發環境下的代碼發布到生產環境的這個過程。簡單的說：
dependencies------生產環境
devdependencies------開發環境
在開發的時候，只需要考慮哪種依賴（模塊）是開發的時候需要？還是上線的時候需要？或者兩者都需要，比如引入Vue時，兩者都需要，我們可以使用npm i vue -save-dev,再比如引入webpack，該依賴只需開發環境下打包使用，線上不需要，所以我們可以使用npm i webpack -save-dev
常用的命令有：
npm install module-name -save 自動把模塊和版本號添加到dependencies部分
npm install module-name -save-dev 自動把模塊和版本號添加到devdependencies部分
注意：
- '-save'可以簡稱為：-S
- '-save-dev'可以簡稱為：-D
2.3、peerDependencies
devDependencies和dependencies相似，如果你經常封裝插件、使用一些ui組件庫，自然對peerDependencies就不會陌生了。
- 問題的產生：
在項目結構中，你引入了一個父類的包（A），當你需要引入類似父類下的一個子類包（B）時，是做不到的，因為node只會在項目的node_modules文件夾中找B，並不會先找到A，再從A文件夾找B。 - 問題的解決：
引入peerDependencies配置：{ "peerDependencies": { "B": "1.0.0" } }就可以解決了