激情乱伦中文字幕,国产一卡二无码,天天操天天添,豆花视频国产,91亚洲欧美福利在线观看,99精品视频在线播放免费,75大香蕉,婷婷色一区二区三区

點(diǎn)擊上方藍(lán)色字體關(guān)注，選擇“設(shè)置星標(biāo)”

一、前言

隨著前端工程化、自動(dòng)化的發(fā)展，模塊化開(kāi)發(fā)已經(jīng)成為當(dāng)下前端的一種潮流，而在一個(gè)完整的Node.js項(xiàng)目中，package.json 文件無(wú)處不在。首先，在項(xiàng)目根目錄會(huì)有，其次在 node_modules 中也頻現(xiàn)。那么這個(gè)文件到底是干嘛的，又有什么作用，今天給大家揭曉。為了回饋粉絲的支持，前端微服務(wù)特開(kāi)啟Node.js專題，系統(tǒng)學(xué)習(xí)Node.js知識(shí)，為還在迷茫路上的你，提供系統(tǒng)化的學(xué)習(xí)，在學(xué)習(xí)過(guò)程中任何問(wèn)題可以在后臺(tái)回復(fù)，小編拉你進(jìn)群共同學(xué)習(xí)，如果對(duì)大家提升有幫助，記得關(guān)注點(diǎn)贊，不錯(cuò)過(guò)每一篇干貨文章。

二、學(xué)到知識(shí)點(diǎn)

了解 package.json的作用
了解創(chuàng)建package.json的方法
了解package.json與項(xiàng)目之間的關(guān)系
確定重要字段和元數(shù)據(jù)
了解如何管理 package.json
了解package.json和package-lock.json的區(qū)別

三、package.json 文件作用

我們?cè)趧?chuàng)建 Node.js項(xiàng)目的時(shí)候，會(huì)遇到 package.json 文件。它是一個(gè) JSON 文件，位于項(xiàng)目的根目錄下。

package.json 包含關(guān)于項(xiàng)目的重要信息。它包含關(guān)于項(xiàng)目的使人類可讀元數(shù)據(jù)（如項(xiàng)目名稱和說(shuō)明）以及功能元數(shù)據(jù)（如程序包版本號(hào)和程序所需的依賴項(xiàng)列表），要想徹底搞懂package.json，我們還得從Node.js的模塊（Module）講起，在Node.js中，模塊可以是一個(gè)庫(kù)或者一個(gè)框架，也可以是一個(gè)Node.js項(xiàng)目，Node.js項(xiàng)目遵循模塊化架構(gòu)，當(dāng)我們創(chuàng)建一個(gè)Node.js項(xiàng)目的時(shí)，這些模塊的描述文件被稱之為package.json文件，package.json是Node.js項(xiàng)目中非常重要的配置文件，是一個(gè)項(xiàng)目的核心，該文件中跟蹤依賴關(guān)系和元數(shù)據(jù)，定義了當(dāng)前項(xiàng)目所需要的各種模塊，以及項(xiàng)目的配置信息，是對(duì)項(xiàng)目或者模塊包的描述，里面包含許多元信息。其定義了運(yùn)行項(xiàng)目所需要的各種依賴和項(xiàng)目的配置信息（比如項(xiàng)目名稱、項(xiàng)目版本、項(xiàng)目執(zhí)行入口文件、執(zhí)行的腳本、依賴的插件、項(xiàng)目貢獻(xiàn)者、許可證以及運(yùn)行、開(kāi)發(fā)以及有選擇地將項(xiàng)目發(fā)布到 npm 所需的信息。）。它是配置和描述如何與程序交互和運(yùn)行的中心,npm和yarn用它來(lái)識(shí)別你的項(xiàng)目并了解如何處理項(xiàng)目的依賴關(guān)系。npm cli 也是管理 package.json 的最佳方法，因?yàn)樗兄谠陧?xiàng)目的整個(gè)生命周期內(nèi)生成和更新 package.json 文件。package.json文件就是一個(gè)JSON對(duì)象，該對(duì)象的每一個(gè)成員就是當(dāng)前項(xiàng)目的一項(xiàng)設(shè)置。

package.json 會(huì)在項(xiàng)目的生命周期中扮演多個(gè)角色，其中某些角色僅適用于發(fā)布到 npm的軟件包，可以啟動(dòng)你的項(xiàng)目、運(yùn)行腳本、安裝依賴項(xiàng)、發(fā)布到npm注冊(cè)表以及許多其他有用的任務(wù)。。即使你沒(méi)有把項(xiàng)目發(fā)布到 npm注冊(cè)表中，或者沒(méi)有將其公開(kāi)發(fā)布給其他人，那么 package.json 對(duì)于開(kāi)發(fā)流程仍然至關(guān)重要。

你的項(xiàng)目還必須包含 package.json，然后才能從 npm安裝軟件包。這也是項(xiàng)目中需要它的主要原因之一。

npm install 命令會(huì)根據(jù)這個(gè)文件下載所有依賴模塊。package.json一般都在項(xiàng)目的根目錄下。

四、package.json 文件創(chuàng)建

package.json 文件創(chuàng)建有兩種方式，手動(dòng)創(chuàng)建和自動(dòng)創(chuàng)建，一般我們使用自動(dòng)創(chuàng)建較多。

4.1手動(dòng)創(chuàng)建

直接在項(xiàng)目根目錄下新建一個(gè) package.json 文件，然后輸入相關(guān)的內(nèi)容。

{
  "name": "express-admin",
  "version": "1.0.0",
  "description": "Express Admin",
  "keywords": [
    "server",
    "express",
    "compression"
  ],
  "homepage":"https://gitee.com/xunzhaotech/express-admin.git",
  "bugs":"https://github.com/owner/project/issues",
  "license": "MIT",
  "author": {
    "name": "Amber luyb",
    "email": "[email protected]",
    "url": "https://www.xunzhaotech.com"
  },
  "contributors": [
    {
      "name": "Amber luyb",
      "email": "[email protected]",
      "url": "https://gitee.com/xunzhaotech/express-admin.git"
    }
  ],
  "funding": [
    {
      "type" : "individual",
      "url" : "http://example.com/donate"
    },
    "http://example.com/donateAlso",
    {
      "type" : "patreon",
      "url" : "https://www.patreon.com/my-account"
    }
  ],
  "files":[".git",
    "CVS",
    ".svn",
    ".hg",
    ".lock-wscript",
    ".wafpickle-N",
    ".*.swp",
    ".DS_Store",
    "._*",
    "npm-debug.log",
    ".npmrc",
    "node_modules",
    "config.gypi",
    "*.orig,"],
  "main": "index.js",
  "browser":"",
  "bin": {
    "myapp": "./cli.js"
  },
  "man": [
    "./man/foo.1",
    "./man/bar.1"
  ],
  "repository": {
    "type": "git",
    "url": "https://gitee.com/xunzhaotech/express-admin.git"
  },
  "scripts": {
    "docs:dev": "vuepress dev docs",
    "docs:build": "vuepress build docs",
    "server": "node server.js",
    "start": "node index.js",
    "dev": "nodemon",
    "lint": "eslint **/*.js"
  },
  "config": {
    "port": "8080"
  },
  "devDependencies": {
    "eslint": "^7.22.0",
    "mockjs": "^1.1.0",
    "nodemon": "^2.0.7",
    "vuepress": "^1.8.2"
  },
  "dependencies": {
    "body-parser": "^1.19.0",
    "compression": "^1.7.4",
    "cookie-parser": "^1.4.5",
    "debug": "^4.3.1",
    "express": "^4.17.1",
    "express-session": "^1.17.1"
  },
  "peerDependencies": {
    "tea": "2.x"
  },
  "peerDependenciesMeta": {
    "soy-milk": {
      "optional": true
    }
  },
  "bundledDependencies": [
    "renderized",
    "super-streams"
  ],
  "optionalDependencies":{},
  "engines": {
    "npm": "~1.0.20"
  },
  "os": [
    "darwin",
    "linux"
  ],
  "cpu": [
    "!arm",
    "!mips"
  ],
  "private": false,
  "publishConfig":{},
  "workspaces": [
    "./packages/*"
  ]
}

4.2自動(dòng)創(chuàng)建

當(dāng)我們新建一個(gè)名稱為 xz-nuxt-admin，在項(xiàng)目根目錄下執(zhí)行 yarn init -y 或 npm init -y 命令后，也可以輸入 npm init或yarn init -y這個(gè)命令采用互動(dòng)方式，要求用戶回答一些問(wèn)題，然后根據(jù)提示一步步輸入相應(yīng)的內(nèi)容完成后即可在項(xiàng)目目錄下會(huì)新增一個(gè)基本的 package.json文件。所有問(wèn)題之中，只有項(xiàng)目名稱（name）和項(xiàng)目版本（version）是必填的，其他都是選填的。內(nèi)容如下：

{
 "name": "my-test",   # 項(xiàng)目名稱
  "version": "1.0.0", # 項(xiàng)目版本（格式：大版本.次要版本.小版本）
  "author": "",       # 作者
  "description": "",  # 項(xiàng)目描述
  "main": "index.js", # 入口文件
  "scripts": {        # 指定運(yùn)行腳本命令的 npm 命令行縮寫
      "test": "echo \"Error: no test specified\" && exit 1"
  },
"keywords": [],       # 關(guān)鍵詞
"license": "ISC"      # 許可證
}

五、package.json 文件配置說(shuō)明

我們知道package.json 中包含的一些最常見(jiàn)和重要的字段，用來(lái)管理項(xiàng)目的配置信息或發(fā)布到 npm，而其他一些則可以幫助 npm CLI 運(yùn)行應(yīng)用程序或安裝依賴項(xiàng)。實(shí)際的字段比我們所介紹的要多，你可以在它的文檔中了解其余字段，但以下的是必須要了解的 package.json 屬性。

5.1 必須字段

package.json 中有非常多的配置項(xiàng)，其中必須填寫的兩個(gè)字段分別是 name 字段和 version 字段，它們是組成一個(gè) npm 模塊的唯一標(biāo)識(shí)。

name

name 字段定義了模塊的名稱，其命名時(shí)需要遵循官方的一些規(guī)范和建議：

項(xiàng)目/模塊名稱，長(zhǎng)度必須小于等于214個(gè)字符，不能以"."(點(diǎn))或者"_"(下劃線)開(kāi)頭，不能包含大寫字母。
模塊名會(huì)成為模塊 url、命令行中的一個(gè)參數(shù)或者一個(gè)文件夾名稱，任何非 url 安全的字符在模塊名中都不能使用（我們可以使用 validate-npm-package-name 包來(lái)檢測(cè)模塊名是否合法）。
語(yǔ)義化模塊名，可以幫助開(kāi)發(fā)者更快的找到需要的模塊，并且避免意外獲取錯(cuò)誤的模塊；
若模塊名稱中存在一些符號(hào)，將符號(hào)去除后不得與現(xiàn)有的模塊名重復(fù)。

name 字段不能與其他模塊名重復(fù)，我們可以執(zhí)行以下命令查看模塊名是否已經(jīng)被使用：npm view <packageName>或者，我們也可以去 npm 上輸入模塊名，如果搜不到，則可以使用該模塊名。

version

在package.json文件中，版本是非常重要的一個(gè)概念，npm 包中的模塊版本都需要遵循 SemVer 規(guī)范，該規(guī)范的標(biāo)準(zhǔn)版本號(hào)采用 X.Y.Z 的格式，其中 X、Y 和 Z 均為非負(fù)的整數(shù)，且禁止在數(shù)字前方補(bǔ)零：
X 是主版本號(hào)(major)：第一位就是主要版本號(hào)。一般來(lái)說(shuō)，重大功能的更新，或功能的添加又不能向后兼容的情況會(huì)提升該版本號(hào)。
Y 是次版本號(hào)(minor)：中間那一位是指次要版本號(hào)。一般來(lái)說(shuō)，一些功能的添加，但又能向后兼容，這種更新會(huì)提升該版本號(hào)。
Z 是修訂號(hào)(patch)：最后一位就是補(bǔ)丁版本號(hào)。一般來(lái)說(shuō)，如果是項(xiàng)目的一些BUG修復(fù)，會(huì)將該版本號(hào)提升。當(dāng)某個(gè)版本改動(dòng)比較大、并非穩(wěn)定而且可能無(wú)法滿足預(yù)期的兼容性需求時(shí)，我們可能要先發(fā)布一個(gè)先行版本。

先行版本號(hào)可以加到主版本號(hào).次版本號(hào).修訂號(hào)的后面，通過(guò) - 號(hào)連接一連串以句點(diǎn)分隔的標(biāo)識(shí)符和版本編譯信息：

內(nèi)部版本(alpha)
公測(cè)版本(beta)
正式版本的候選版本rc（即 Release candiate）

我們可以執(zhí)行以下命令查看模塊的版本：

$npm view <packageName> version  # 查看某個(gè)模塊的最新版本
$npm view <packageName> versions # 查看某個(gè)模塊的所有歷史版本

5.2 可選字段

可選字段是除去必填字段需要補(bǔ)充的項(xiàng)目信息

描述信息（description & keywords）

description：字段用于添加模塊的描述信息，便于用戶了解該模塊，是一個(gè)字符串。它可以幫助人們?cè)谑褂胣pm search時(shí)找到這個(gè)包。
keywords 項(xiàng)目關(guān)鍵字，是一個(gè)字符串?dāng)?shù)組。用于給模塊添加關(guān)鍵字。它可以幫助人們?cè)谑褂胣pm search時(shí)找到這個(gè)包。
當(dāng)我們使用 npm 檢索模塊時(shí)，會(huì)對(duì)模塊中的 description 字段和 keywords 字段進(jìn)行匹配，寫好 package.json中的 description 和 keywords 將有利于增加我們模塊的曝光率。

安裝項(xiàng)目依賴（dependencies & devDependencies）

dependencies：字段指定了項(xiàng)目運(yùn)行所依賴的模塊（生產(chǎn)環(huán)境下，項(xiàng)目運(yùn)行所需依賴）。
devDependencies：指定項(xiàng)目開(kāi)發(fā)所需要的模塊（開(kāi)發(fā)環(huán)境下，項(xiàng)目所需依賴）。
說(shuō)明:我們?cè)谑褂胿ue框架開(kāi)發(fā)一個(gè)程序，開(kāi)發(fā)階段需要用到webpack來(lái)構(gòu)建你的開(kāi)發(fā)和本地運(yùn)行環(huán)境。所以vue一定要放到dependencies里，因?yàn)橐院蟪绦虻缴a(chǎn)環(huán)境也要用。webpack則是你用來(lái)壓縮代碼，打包等需要的工具，程序?qū)嶋H運(yùn)行的時(shí)候并不需要，所以放到devDependencies里就可以了。或者我們?cè)趯懗绦蛞肊S6標(biāo)準(zhǔn)，瀏覽器并不完全支持，所以你要用到babel來(lái)轉(zhuǎn)換代碼，babel放devDependencies。程序里有用到開(kāi)源組件，比如你想用antd，antd要放dependencies。

簡(jiǎn)化終端命令（scripts）

scripts 字段是 package.json 中的一種元數(shù)據(jù)功能，它接受一個(gè)對(duì)象，對(duì)象的屬性為可以通過(guò) npm run 運(yùn)行的腳本，值為實(shí)際運(yùn)行的命令（通常是終端命令），如：

  "scripts": {
     "dev": "nuxt",
     "build": "nuxt build",
     "start": "nuxt start",
     "generate": "nuxt generate"
 },

將終端命令放入 scripts 字段，既可以記錄它們又可以實(shí)現(xiàn)輕松重用。

定義項(xiàng)目入口（main）

main 字段是 package.json 中的另一種元數(shù)據(jù)功能，它可以用來(lái)指定加載的入口文件。假如你的項(xiàng)目是一個(gè) npm 包，當(dāng)用戶安裝你的包后，const ModuleName = require('module-name') 返回的是 main 字段中所列出文件的 module.exports 屬性。當(dāng)不指定main 字段時(shí)，默認(rèn)值是模塊根目錄下面的index.js 文件。

發(fā)布文件配置（files）

files 字段用于描述我們使用 npm publish 命令后推送到 npm 服務(wù)器的文件列表，如果指定文件夾，則文件夾內(nèi)的所有內(nèi)容都會(huì)包含進(jìn)來(lái)。我們可以查看下載的 antd 的 package.json 的files 字段，內(nèi)容如下：

"files": [
   "dist",
   "lib",
   "es"
    ……
],

可以看到下載后的 antd 包是下面的目錄結(jié)構(gòu)中包含了 /dist/"lib/es文件，另外，我們還可以通過(guò)配置一個(gè) .npmignore 文件來(lái)排除一些文件，防止大量的垃圾文件推送到 npm 上。

定義私有模塊（private）

一般公司的非開(kāi)源項(xiàng)目，都會(huì)設(shè)置 private 屬性的值為 true，這是因?yàn)?npm 拒絕發(fā)布私有模塊，通過(guò)設(shè)置該字段可以防止私有模塊被無(wú)意間發(fā)布出去。

指定模塊適用系統(tǒng)（os）

使用 os 屬性可以指定模塊適用系統(tǒng)的系統(tǒng)，或者指定不能安裝的系統(tǒng)黑名單（當(dāng)在系統(tǒng)黑名單中的系統(tǒng)中安裝模塊則會(huì)報(bào)錯(cuò)）

"os" : [ "darwin", "linux" ] # 適用系統(tǒng)
"os" : [ "!win32" ] # 黑名單

在 node 環(huán)境下可以使用 process.platform 來(lái)判斷操作系統(tǒng)

指定模塊適用 cpu 架構(gòu)（cpu）

我們可以用 cpu 字段更精準(zhǔn)的限制用戶安裝環(huán)境

"cpu" : [ "x64", "ia32" ] # 適用 cpu
"cpu" : [ "!arm", "!mips" ] # 黑名單

在 node 環(huán)境下可以使用 process.arch 來(lái)判斷 cpu 架構(gòu)

指定項(xiàng)目 node 版本（engines）

防止因node 版本不同，導(dǎo)致會(huì)出現(xiàn)很多奇奇怪怪的問(wèn)題（如某些依賴安裝報(bào)錯(cuò)、依賴安裝完項(xiàng)目跑不起來(lái)等）。

"engines": {
  "node": ">= 8.16.0",
  "npm": ">= 6.9.0"
},

需要注意的是，engines屬性僅起到一個(gè)說(shuō)明的作用，當(dāng)用戶版本不符合指定值時(shí)也不影響依賴的安裝

自定義命令（bin）

bin 字段用來(lái)指定各個(gè)內(nèi)部命令對(duì)應(yīng)的可執(zhí)行文件的位置。主要應(yīng)用在腳手架搭建中，當(dāng)package.json 提供了 bin 字段后，即相當(dāng)于做了一個(gè)命令名和本地文件名的映射。當(dāng)用戶安裝帶有 bin 字段的包時(shí)，

如果是全局安裝，npm 將會(huì)使用符號(hào)鏈接把這些文件鏈接到/usr/local/node_modules/.bin/；
如果是本地安裝，會(huì)鏈接到./node_modules/.bin/。如果要使用 mfd-cli 作為命令時(shí)，可以配置以下 bin 字段：

"bin": {
  "mfd-cli": "./bin/cli.js"
  }

上面代碼指定，mfd-cli 命令對(duì)應(yīng)的可執(zhí)行文件為 bin 子目錄下的 cli.js，因此在安裝了 mfd-cli 包的項(xiàng)目中，就可以很方便地利用 npm執(zhí)行腳本：

"scripts": {
    start: 'node node_modules/.bin/mfd-cli'
 }

這里看起來(lái)和 vue create/create-react-app之類的命令不太一樣？是因?yàn)椋寒?dāng)需要 node 環(huán)境時(shí)就需要加上 node 前綴如果加上 node 前綴，就需要指定mfd-cli 的路徑 -> node_modules/.bin，否則 node mfd-cli會(huì)去查找當(dāng)前路徑下的 mfd-cli.js，這樣肯定是不對(duì)。若要實(shí)現(xiàn)像 vue create/create-react-app之類的命令一樣簡(jiǎn)便的方式，則可以在上文提到的 bin 子目錄下可執(zhí)行文件cli.js 中的第一行寫入以下命令：#!/usr/bin/env node這行命令的作用是告訴系統(tǒng)用 node 解析，這樣命令就可以簡(jiǎn)寫成 mfd-cli 了。

設(shè)置應(yīng)用根路徑（homepage）

當(dāng)我們使用 create-react-app 腳手架搭建的 React 項(xiàng)目，默認(rèn)是使用內(nèi)置的 webpack 配置，當(dāng)package.json 中不配置 homepage 屬性時(shí)，build 打包之后的文件資源應(yīng)用路徑默認(rèn)是/。

一般來(lái)說(shuō)，我們打包的靜態(tài)資源會(huì)部署在 CDN 上，為了讓我們的應(yīng)用知道去哪里加載資源，則需要我們?cè)O(shè)置一個(gè)根路徑，這時(shí)可以通過(guò) package.json 中的 homepage 字段設(shè)置應(yīng)用的根路徑。

當(dāng)我們?cè)O(shè)置了 homepage 屬性后：

{
    "homepage": "https://xxxx.cdn/project-name",
}

打包后的資源路徑就會(huì)加上 homepage 的地址：/project-name/bundle.js

其它配置

author：項(xiàng)目開(kāi)發(fā)者，它的值是你在https://npmjs.org網(wǎng)站的有效賬戶名，遵循“賬戶名<郵件>”的規(guī)則，例如：[email protected]。
private：是否私有，設(shè)置為 true 時(shí)，npm 拒絕發(fā)布。
license：軟件授權(quán)條款，讓用戶知道他們的使用權(quán)利和限制。
bugs：bug 提交地址。
contributors：項(xiàng)目貢獻(xiàn)者。
repository：項(xiàng)目倉(cāng)庫(kù)地址。
module：是以 ES Module(也就是 ES6)模塊化方式進(jìn)行加載，因?yàn)樵缙跊](méi)有 ES6 模塊化方案時(shí)，都是遵循 CommonJS 規(guī)范，而 CommonJS 規(guī)范的包是以 main 的方式表示入口文件的，為了區(qū)分就新增了 module 方式，但是 ES6 模塊化方案效率更高，所以會(huì)優(yōu)先查看是否有 module 字段，沒(méi)有才使用 main 字段。
eslintConfig：EsLint 檢查文件配置，自動(dòng)讀取驗(yàn)證。
browserslist：供瀏覽器使用的版本列表。
style：供瀏覽器使用時(shí)，樣式文件所在的位置；樣式文件打包工具parcelify，通過(guò)它知道樣式文件的打包位置。

六、package.json和package-lock.json的區(qū)別

為什么有了package.json，還需要package-lock.json文件呢，當(dāng)node_modules文件夾并不存在或被刪除時(shí)，需要用到npm install重新裝載全部依賴時(shí)，通過(guò)package-lock.json可以直接表明下載地址和相關(guān)依賴，相對(duì)下載速度也更快，也不容易報(bào)錯(cuò)。

Node.js專題講解 第2期 package.json

一、前言

二、學(xué)到知識(shí)點(diǎn)