你真的瞭解package.json嗎？來看看吧，這多是最全的package解析

時間  2021-08-12
標籤 javascript html 前端 java node react linux webpack git github 欄目 JavaScript 简体版
原文   原文鏈接

1. 概述

從咱們接觸前端開始，每一個項目的根目錄下通常都會有一個package.json文件，這個文件定義了當前項目所須要的各類模塊，以及項目的配置信息（好比名稱、版本、許可證等）。javascript

當運行npm install命令的時候，會根據package.json文件中的配置自動下載所需的模塊，也就是配置項目所需的運行和開發環境。html

好比下面這個文件，只存在簡單的項目名稱和版本號。前端

{
  "name" : "yindong",
  "version" : "1.0.0",
}
複製代碼

package.json文件是一個JSON對象，這從他的後綴名.json就能夠看出來，該對象的每個成員就是當前項目的一項設置。好比name就是項目名稱，version是版本號。java

固然不少人其實並不關心package.json的配置，他們應用的更多的是dependencies或devDependencies配置。node

下面是一個更完整的package.json文件，詳細解釋一下每一個字段的真實含義。react

{
    "name": "yindong",
    "version":"0.0.1",
    "description": "antd-theme",
    "keywords":["node.js","antd", "theme"],
    "homepage": "https://zhiqianduan.com",
    "bugs":{"url":"http://path/to/bug","email":"yindong@xxxx.com"},
    "license": "ISC",
    "author": "yindong",
    "contributors":[{"name":"yindong","email":"yindong@xxxx.com"}],
    "files": "",
    "main": "./dist/default.js",
    "bin": "",
    "man": "",
    "directories": "",
    "repository": {
		"type": "git",
		"url": "https://path/to/url"
	},
    "scripts": {
      "start": "webpack serve --config webpack.config.dev.js --progress"
    },
    "config": { "port" : "8080" },
    "dependencies": {},
    "devDependencies": {
        "@babel/core": "^7.14.3",
        "@babel/preset-env": "^7.14.4",
        "@babel/preset-react": "^7.13.13",
        "babel-loader": "^8.2.2",
        "babel-plugin-import": "^1.13.3",
        "glob": "^7.1.7",
        "less": "^3.9.0",
        "less-loader": "^9.0.0",
        "style-loader": "^2.0.0",
        "webpack": "^5.38.1",
        "webpack-cli": "^4.7.0",
        "webpack-dev-server": "^3.11.2"
    },
    "peerDependencies": {
        "tea": "2.x"
    },
    "bundledDependencies": [
        "renderized", "super-streams"
    ],
    "engines": {"node": "0.10.x"},
	  "os" : [ "win32", "darwin", "linux" ],
    "cpu" : [ "x64", "ia32" ],
    "private": false,
    "publishConfig": {}
  }
  
複製代碼

2. name字段

package.json文件中最重要的就是name和version字段，這兩項是必填的。名稱和版本一塊兒構成一個標識符，該標識符被認爲是徹底惟一的。對包的更改應該與對版本的更改一塊兒進行。linux

name必須小於等於214個字符，不能以.或_開頭，不能有大寫字母，由於名稱最終成爲URL的一部分所以不能包含任何非URL安全字符。 npm官方建議咱們不要使用與核心節點模塊相同的名稱。不要在名稱中加js或node。若是須要可使用engines來指定運行環境。webpack

該名稱會做爲參數傳遞給require，所以它應該是簡短的，但也須要具備合理的描述性。git

3. version字段

version通常的格式是x.x.x, 而且須要遵循該規則。github

package.json文件中最重要的就是name和version字段，這兩項是必填的。名稱和版本一塊兒構成一個標識符，該標識符被認爲是徹底惟一的。每次發佈時version不能與已存在的一致。

4. description字段

description是一個字符串，用於編寫描述信息。有助於人們在npm庫中搜索的時候發現你的模塊。

5. keywords字段

keywords是一個字符串組成的數組，有助於人們在npm庫中搜索的時候發現你的模塊。

6. homepage字段

homepage項目的主頁地址。

7. bugs字段

bugs用於項目問題的反饋issue地址或者一個郵箱。

"bugs": { 
  "url" : "https://github.com/owner/project/issues",
  "email" : "project@hostname.com"
}
複製代碼

8. license字段

license是當前項目的協議，讓用戶知道他們有何權限來使用你的模塊，以及使用該模塊有哪些限制。

"license" : "BSD-3-Clause"
複製代碼

9. author字段 contributors字段

author是具體一我的，contributors表示一羣人，他們都表示當前項目的共享者。同時每一個人都是一個對象。具備name字段和可選的url及email字段。

"author": {
  "name" : "yindong",
  "email" : "yindong@xx.com",
  "url" : "https://zhiqianduan.com/"
}
複製代碼

也能夠寫成一個字符串

"author": "yindong yindong@xx.com (https://zhiqianduan.com/)"
複製代碼

10. files字段

files屬性的值是一個數組，內容是模塊下文件名或者文件夾名，若是是文件夾名，則文件夾下全部的文件也會被包含進來（除非文件被另外一些配置排除了）

能夠在模塊根目錄下建立一個.npmignore文件，寫在這個文件裏邊的文件即使被寫在files屬性裏邊也會被排除在外，這個文件的寫法與.gitignore相似。

11. main字段

main字段指定了加載的入口文件，require導入的時候就會加載這個文件。這個字段的默認值是模塊根目錄下面的index.js。

12. bin字段

bin項用來指定每一個內部命令對應的可執行文件的位置。若是你編寫的是一個node工具的時候必定會用到bin字段。

當咱們編寫一個cli工具的時候，須要指定工具的運行命令，好比經常使用的webpack模塊，他的運行命令就是webpack。

"bin": {
  "webpack": "bin/index.js",
}
複製代碼

當咱們執行webpack命令的時候就會執行bin/index.js文件中的代碼。

在模塊以依賴的方式被安裝，若是存在bin選項。在node_modules/.bin/生成對應的文件， Npm會尋找這個文件，在node_modules/.bin/目錄下創建符號連接。因爲node_modules/.bin/目錄會在運行時加入系統的PATH變量，所以在運行npm時，就能夠不帶路徑，直接經過命令來調用這些腳本。

全部node_modules/.bin/目錄下的命令，均可以用npm run [命令]的格式運行。在命令行下，鍵入npm run，而後按tab鍵，就會顯示全部可使用的命令。

13. man字段

man用來指定當前模塊的man文檔的位置。

"man" :[ "./doc/calc.1" ]
複製代碼

14. directories字段

directories制定一些方法來描述模塊的結構, 用於告訴用戶每一個目錄在什麼位置。

15. repository字段

指定一個代碼存放地址，對想要爲你的項目貢獻代碼的人有幫助

"repository" : {
  "type" : "git", 
  "url" : "https://github.com/npm/npm.git"
}
複製代碼

16. scripts字段

scripts指定了運行腳本命令的npm命令行縮寫，好比start指定了運行npm run start時，所要執行的命令。

"scripts": {
  "start": "node ./start.js"
}
複製代碼

使用scripts字段能夠快速的執行shell命令，能夠理解爲alias。

scripts能夠直接使用node_modules中安裝的模塊，這區別於直接運行須要使用npx命令。

"scripts": {
  "build": "webpack"
}

// npm run build
// npx webpack
複製代碼

17. config字段

config字段用於添加命令行的環境變量。

{
  "name" : "yindong",
  "config" : { "port" : "8080" },
  "scripts" : { "start" : "node server.js" }
}
複製代碼

而後，在server.js腳本就能夠引用config字段的值。

console.log(process.env.npm_package_config_port); // 8080
複製代碼

用戶能夠經過npm config set來修改這個值。

npm config set yindong:port 8000
複製代碼

18. dependencies字段, devDependencies字段

dependencies字段指定了項目運行所依賴的模塊，devDependencies指定項目開發所須要的模塊。

它們的值都是一個對象。該對象的各個成員，分別由模塊名和對應的版本要求組成，表示依賴的模塊及其版本範圍。

當安裝依賴的時候使用--save參數表示將該模塊寫入dependencies屬性，--save-dev表示將該模塊寫入devDependencies屬性。

"devDependencies": {
        "webpack": "^5.38.1",
}
複製代碼

對象的每一項經過一個鍵值對錶示，前面是模塊名稱，後面是對應模塊的版本號。版本號遵循「大版本.次要版本.小版本」的格式規定。

版本說明

固定版本: 好比5.38.1，安裝時只安裝指定版本。 波浪號: 好比~5.38.1, 表示安裝5.38.x的最新版本（不低於5.38.1），可是不安裝5.39.x，也就是說安裝時不改變大版本號和次要版本號。 插入號: 好比ˆ5.38.1, ，表示安裝5.x.x的最新版本（不低於5.38.1），可是不安裝6.x.x，也就是說安裝時不改變大版本號。須要注意的是，若是大版本號爲0，則插入號的行爲與波浪號相同，這是由於此時處於開發階段，即便是次要版本號變更，也可能帶來程序的不兼容。 latest: 安裝最新版本。

19. peerDependencies字段

當咱們開發一個模塊的時候，若是當前模塊與所依賴的模塊同時依賴一個第三方模塊，而且依賴的是兩個不兼容的版本時就會出現問題。

好比，你的項目依賴A模塊和B模塊的1.0版，而A模塊自己又依賴B模塊的2.0版。

大多數狀況下，這不構成問題，B模塊的兩個版本能夠並存，同時運行。可是，有一種狀況，會出現問題，就是這種依賴關係將暴露給用戶。

最典型的場景就是插件，好比A模塊是B模塊的插件。用戶安裝的B模塊是1.0版本，可是A插件只能和2.0版本的B模塊一塊兒使用。這時，用戶要是將1.0版本的B的實例傳給A，就會出現問題。所以，須要一種機制，在模板安裝的時候提醒用戶，若是A和B一塊兒安裝，那麼B必須是2.0模塊。

peerDependencies字段，就是用來供插件指定其所須要的主工具的版本。能夠經過peerDependencies字段來限制，使用myless模塊必須依賴less模塊的3.9.x版本.

{
  "name": "myless",
  "peerDependencies": {
    "less": "3.9.x"
  }
}
複製代碼

注意，從npm 3.0版開始，peerDependencies再也不會默認安裝了。就是初始化的時候不會默認帶出。

20. bundledDependencies字段

bundledDependencies指定發佈的時候會被一塊兒打包的模塊.

21. optionalDependencies字段

若是一個依賴模塊能夠被使用， 同時你也但願在該模塊找不到或沒法獲取時npm繼續運行，你能夠把這個模塊依賴放到optionalDependencies配置中。這個配置的寫法和dependencies的寫法同樣，不一樣的是這裏邊寫的模塊安裝失敗不會致使npm install失敗。

22. engines字段

engines字段指明瞭該模塊運行的平臺，好比Node或者npm的某個版本或者瀏覽器。

{ "engines" : { "node" : ">=0.10.3 <0.12", "npm" : "~1.0.20" } }
複製代碼

23. os字段

能夠指定你的模塊只能在哪一個操做系統上運行

"os" : [ "darwin", "linux", "win32" ]
複製代碼

24. cpu字段

限制模塊只能在某種架構的cpu下運行

"cpu" : [ "x64", "ia32" ]
複製代碼

25. private字段

若是這個屬性被設置爲true，npm將拒絕發佈它，這是爲了防止一個私有模塊被無心間發佈出去。

"private": true
複製代碼

26. publishConfig字段

這個配置是會在模塊發佈時生效，用於設置發佈用到的一些值的集合。若是你不想模塊被默認標記爲最新的，或者默認發佈到公共倉庫，能夠在這裏配置tag或倉庫地址。

一般publishConfig會配合private來使用，若是你只想讓模塊被髮布到一個特定的npm倉庫，如一個內部的倉庫。

"private": true,
"publishConfig": {
  "tag": "1.0.0",
  "registry": "https://registry.npmjs.org/",
  "access": "public"
}
複製代碼

27. preferGlobal字段

preferGlobal的值是布爾值，表示當用戶不將該模塊安裝爲全局模塊時（即不用–global參數），要不要顯示警告，表示該模塊的本意就是安裝爲全局模塊。

"preferGlobal": false
複製代碼

28. browser字段

browser指定該模板供瀏覽器使用的版本。Browserify這樣的瀏覽器打包工具，經過它就知道該打包那個文件。

"browser": {
  "tipso": "./node_modules/tipso/src/tipso.js"
},
複製代碼

參考來源

轉載須知

如轉載必須標明文章出處，文章名稱，文章做者，格式以下:

轉自：【掘金 - https://juejin.cn/】 你真的瞭解package.json嗎？來看看吧，這多是最全的package解析 "隱冬"

相關文章
相關標籤/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公眾號
   歡迎關注本站公眾號,獲取更多信息
聯繫我們 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程