package.json的全部配置項及其用法，你都熟悉麼

寫在前面

在前端開發中，npm已是必不可少的工具了。使用npm，不可避免的就要和package.json打交道。平時package.json用得挺多，可是沒有認真看過官方文檔。本文結合npm官方文檔以及本身平時使用過程當中的感悟，談一談package.json。官方文檔在這裏。

初始化

使用npm init命令就能夠初始化一個package.json文件。在初始化的過程當中，會叫用戶輸入name, version等等信息，固然，你均可以忽略。一路點回車，就生成了下面這樣一個初始化的package.json。

{
  "name": "test", // 假如項目叫作test
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}
複製代碼

上面的package.json包含了項目的名稱，版本號，描述，入口文件，執行腳本，做者，開源協議等。package.json的內容遠不止這些，下面將一一進行介紹。在開發業務項目和開發組件庫的時候，package.json是略有不同的。我會把我認爲重要的配置項加黑標識出來。

詳細介紹

• name: 這個很好理解，就是package的名稱。不過須要注意的是，name有長度限制(雖然通常都不會超)，並且name不能以 【點】 或者 【下劃線】開頭，name中不能有大寫字母。這個是每個package必須的。在業務代碼中，經過require(${name})就能夠引入對應的程序包了。

• version: package的版本。對於業務項目來講，這個每每不過重要，可是若是你要發佈本身的項目，這個就顯得十分重要了。name和version共同決定了惟一一份代碼。npm是用[npm-semver來解析版本號的。咱們通常見到的都是大版本.次要版本.小版本這種版本號，好比16.1.0。版本號的規則、含義其實蠻多的，能夠參考這篇文章。

• desription：包的描述。開發組件庫時必需，簡明的向庫的使用者介紹這個庫是幹嗎的。對於公司的業務項目，這個配置項通常無所謂。

• keywords：關鍵詞。一個字符串數組，對這個npm包的介紹。組件庫必需，便於使用者在npm中搜索。對於公司業務項目，這個配置通常無所謂。

• homepage： 項目主頁。對於開發組件庫來講挺有用的。

• bugs：開發者的聯繫方式，代碼庫的issues地址等。若是代碼使用者發現了bug，能夠經過這個配置項找到提bug的地方。

• license：開源協議。對於開源組件庫，這個十分重要。以前react還由於這事兒沒少被社區嫌棄。開源協議略微複雜，用阮一峯前輩的一張圖來講明一下吧。注：圖裏少了ISC, ISC和BSD差很少

• author：項目的做者。能夠爲字符串，對象。

• contributors：項目的貢獻者。author的數組。

• main：代碼入口。這個十分重要，特別是對於組件庫。當你想在node_modules中修改你使用的某個組件庫的代碼時，首先在node_modules中找到這個組件庫，第一眼就是要看這個main，找到組件庫的入口文件。在這個入口文件中再去修改代碼吧。

• scripts：指定了運行腳本命令的npm命令行縮寫。十分重要。

來看一個例子：

"scripts": {
    "dev": "NODE_ENV=dev webpack-dev-server --progress --hot --host 0.0.0.0 --port 8089",
    "test": "NODE_ENV=test webpack --config webpack.test.config.js --progress",
    "online": "NODE_ENV=production webpack --config webpack.online.config.js --progress",
    "build": "webpack",
    "node": "node server.js"
  },
複製代碼

在命令行輸入：npm run dev , 對應的命令就會被執行。這裏有一個地方須要注意，當執行npm run xxx的時候，node_modules/.bin/目錄會在運行時被加入系統的PATH變量。上面的例子，當咱們在命令行輸入：npm run build時，其實真正執行的命令是node_modules/.bin/webpack而不是webpack。因此，當你的webpack並未全局安裝時，直接在命令行輸入：webpack是會報錯的。由於你的webapck是安裝在node_modules/.bin/下面的。

• directories：對整個代碼結構的描述。告訴代碼包使用者能夠在哪裏找到對應的文件。

• files：數組。表示代碼包下載安裝完成時包括的全部文件。

• repository：對於組件庫頗有用。讓組件庫使用者找到你的代碼庫地址。這個配置項會直接在組件庫的npm首頁生效。例子:

  "repository": {
      "type": "git",
      "url": "git+https://github.com/CoyPan/react-scroll-to-show-cb.git"
  },
  複製代碼

• config：用於添加命令行的環境變量。具體用法見這裏。

• dependencies：項目的依賴。經過npm install --save安裝的包會出如今這裏。注意，不要把測試工具、代碼轉換器或者打包工具等放在這裏。當你在命令行裏面使用npm install react --save時，react就會出如今dependencies。默認是安裝最新的版本。若是想安裝某個特定的版本，能夠npm install react@15.6.2。如下的dependencies，格式都是合法的，

  "dependencies" : { 
      "foo" : "1.0.0 - 2.9999.9999",
      "bar" : ">=1.0.2 <2.1.2",
      "baz" : ">1.0.2 <=2.3.4",
      "boo" : "2.0.1",
      "qux" : "<1.0.0 || >=2.3.1 <2.4.5 || >=2.5.2 <3.0.0",
      "asd" : "http://asdf.com/asdf.tar.gz",
      "til" : "~1.2",
      "elf" : "~1.2.3",
      "two" : "2.x",
      "thr" : "3.3.x",
      "lat" : "latest",
      "dyl" : "file:../dyl"
    }
  複製代碼

  咱們常見的是下面這些：

  "dependencies": {
      "foo": "1.0.0", // 指定了就是1.0.0版本
      "bar": "~1.2.2", // 安裝版本號不低於1.2.2的1.2.x的最新版本，例如:1.2.3， 1.2.4等等。1.2.1 ，1.3.x 等就不行了
      "baz": "ˆ1.2.2", // 安裝版本號不低於1.2.2的1.x.x的最新版本，例如: 1.2.7，1.3.1，1.7.8等。1.2.1 ，2.0.0 等就不行了。注意，若是配置是^0.x.x，則和~0.x.x的效果同樣。				
      "lat": "latest"  // 安裝最新版本
  }
  複製代碼

  dependencies 還能夠像下面這樣配置：

  "dependencies": {
      "foo": "git+ssh://git@github.com:foo/foo.git#v1.0.1",
  }
  複製代碼

  foo組件的地址爲git+ssh://{foo代碼庫的ssh地址}#v{foo的版本號}

  這樣的配置在下面這種場景十分有用：

  組內的許多項目都有同一個功能，把這個功能抽出來作成組件是很天然的想法。可是每一個項目都有本身的代碼庫，公司也沒有內部的npm庫，組件應該放在哪裏呢？能夠專門爲組件新建一個代碼倉庫，將組件放在這裏開發、迭代。這樣，各個項目均可以引用該組件：只須要在dependencies中將組件配置成上述的形式。至於組件的版本，能夠經過git tag來控制。

  dependencies還有其餘的配置方式，具體在這裏查看。

• devDependencies：項目的依賴。經過npm run install --save-dev安裝的包會出如今這裏。主要是在開發過程中依賴的一些工具。用法與dependencies類似。

• bundledDependencies：數組，打包時的依賴。若是配置了bundledDependencies，在項目中執行 npm pack將項目打包時，最後生成的.tgz包中，會包含bundledDependencies中配置的依賴。bundledDependencies中的依賴必須在devDependencies或者dependencies中聲明過。

• peerDependencies: 指定當前組件的依賴以其版本。若是組件使用者在項目中安裝了其餘版本的同一依賴，會提示報錯。

• engines：指定項目所依賴的node環境、npm版本等。

• private：若是設爲true，沒法經過npm publish發佈代碼。

• bin：用來指定各個內部命令對應的可執行文件的路徑。具體用法這裏很少講了。詳情能夠點擊這裏。

總結

本文涵蓋了package.json絕大部分的配置項。個人觀點是：若是是公司的業務項目，對於package.json，通常狀況下，我以爲只須要關注好scripts，dependencies，devDependencies這三個地方就夠了。而對於開源的組件庫，則至少須要關注好上面標黑的幾個點。理解好重要配置的含義，提高開發效率，減小踩坑的機率。

寫在後面

本文結合官方文檔以及本身平時工做中的體會，闡述了package.json這個配置文件中各項的含義以及用法。符合預期。