這篇文章帶大家了解一下Node.js專案中package.json文件,看看它的功能、創建方法,了解如何管理package.json,以及package.json和package-lock .json的區別。
隨著前端工程化、自動化的發展,模組化開發已經成為當下前端的一種潮流,而在一個完整的Node.js專案中,package.json 檔案無所不在。首先,在專案根目錄會有,其次在 node_modules 中也頻現。那麼這個文件到底是幹嘛的,又有什麼作用,今天要給大家揭曉。 【推薦學習:《nodejs 教學》】
我們在建立 Node.js專案的時候,會遇到 package.json 檔案。它是一個 JSON 文件,位於專案的根目錄下。
package.json 包含關於專案的重要資訊。它包含關於專案的使人類可讀元資料(如專案名稱和說明)以及功能元資料(如套件版本號和程式所需的依賴項清單),要徹底搞懂package.json,我們還得從Node.js的模組(Module)講起。
在Node.js中,模組可以是一個函式庫或框架,也可以是Node.js項目,Node.js項目遵循模組化架構,當我們建立一個Node.js項目的時,這些模組的描述檔稱為package.json檔案。
package.json是Node.js專案中非常重要的配置文件,是專案的核心,該檔案中追蹤依賴關係和元數據,定義了當前專案所需的各種模組,以及專案的設定訊息,是專案或模組包的描述,裡麵包含許多元資訊。
其定義了執行專案所需的各種依賴和專案的設定資訊(例如專案名稱、專案版本、專案執行入口檔案、執行的腳本、依賴的插件、專案貢獻者、許可證以及運行、開發以及選擇性地將專案發佈到npm 所需的資訊。)。
它是配置和描述如何與程式互動和運行的中心,npm和yarn用它來識別你的專案並了解如何處理專案的依賴關係。
npm cli 也是管理 package.json 的最佳方法,因為它有助於在專案的整個生命週期中產生和更新 package.json 檔案。 package.json檔案就是一個JSON對象,而這個物件的每個成員就是目前專案的一個設定。
package.json 會在專案的生命週期中扮演多個角色,其中某些角色只適用於發佈到npm的軟體包,可以啟動你的專案、運行腳本、安裝依賴項、發佈到npm註冊表以及許多其他有用的任務。 。即使你沒有把專案發佈到 npm註冊表中,或者沒有將其公開發布給其他人,那麼 package.json 對於開發流程仍然至關重要。
你的專案也必須包含 package.json,然後才能從 npm安裝軟體套件。這也是專案中需要它的主要原因之一。
npm install 指令會根據這個檔案下載所有依賴模組。 package.json一般都在專案的根目錄下。
package.json 檔案建立有兩種方式,手動建立和自動建立,一般我們使用自動建立較多。
建立專案目錄
$mkdir node-demo>cd node-demo>touch package.json
直接在專案根目錄下新建一個package.json 文件,然後輸入相關的內容。
{ "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": "luyb@xunzhaotech.com", "url": "https://www.xunzhaotech.com" }, "contributors": [ { "name": "Amber luyb", "email": "luyb@xunzhaotech.com", "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/*" ] }
當我們新建一個名稱為xz-nuxt-admin
, 在專案根目錄下執行yarn init -y
或npm init -y
指令後,也可以輸入npm init
或yarn init -y
這個指令採用互動方式,要求使用者回答一些問題,然後根據提示一步步輸入對應的內容完成後即可在專案目錄下會新增一個基本的package.json檔案。在所有問題之中,只有項目名稱(name)和項目版本(version)是必填的,其他都是選填的。內容如下:
{ "name": "my-test", # 项目名称 "version": "1.0.0", # 项目版本(格式:大版本.次要版本.小版本) "author": "", # 作者 "description": "", # 项目描述 "main": "index.js", # 入口文件 "scripts": { # 指定运行脚本命令的 npm 命令行缩写 "test": "echo \"Error: no test specified\" && exit 1" }, "keywords": [], # 关键词 "license": "ISC" # 许可证 }
#我們知道package.json 中包含的一些最常見和重要的字段,用來管理專案的設定資訊或發佈到npm,而其他一些則可以幫助npm CLI 運行應用程式或安裝相依性。實際的字段比我們所介紹的要多,你可以在它的文檔中了解其餘字段,但以下的是必須要了解的 package.json 屬性。
package.json 中有非常多的配置项,其中必须填写的两个字段分别是 name 字段和 version 字段,它们是组成一个 npm 模块的唯一标识。
name 字段定义了模块的名称,其命名时需要遵循官方的一些规范和建议:
name 字段不能与其他模块名重复,我们可以执行以下命令查看模块名是否已经被使用:
npm view 3dc77a3840d1fe4f8d7a0f0a6f003876
或者,我们也可以去 npm 上输入模块名,如果搜不到,则可以使用该模块名。
当某个版本改动比较大、并非稳定而且可能无法满足预期的兼容性需求时,我们可能要先发布一个先行版本。
先行版本号可以加到主版本号.次版本号.修订号的后面,通过 - 号连接一连串以句点分隔的标识符和版本编译信息:
我们可以执行以下命令查看模块的版本:
$npm view <packageName> version # 查看某个模块的最新版本 $npm view <packageName> versions # 查看某个模块的所有历史版本
可选字段是除去必填字段需要补充的项目信息
说明:
我们在使用vue框架开发一个程序,开发阶段需要用到webpack来构建你的开发和本地运行环境。所以vue一定要放到dependencies里,因为以后程序到生产环境也要用。webpack则是你用来压缩代码,打包等需要的工具,程序实际运行的时候并不需要,所以放到devDependencies里就可以了。或者我们在写程序要用ES6标准,浏览器并不完全支持,所以你要用到babel来转换代码,babel放devDependencies。程序里有用到开源组件,比如你想用antd,antd要放dependencies。
scripts 字段是 package.json 中的一种元数据功能,它接受一个对象,对象的属性为可以通过 npm run 运行的脚本,值为实际运行的命令(通常是终端命令),如:
"scripts": { "dev": "nuxt", "build": "nuxt build", "start": "nuxt start", "generate": "nuxt generate" },
将终端命令放入 scripts 字段,既可以记录它们又可以实现轻松重用。
main 字段是 package.json 中的另一种元数据功能,它可以用来指定加载的入口文件。假如你的项目是一个 npm 包,当用户安装你的包后,const ModuleName = require('module-name') 返回的是 main 字段中所列出文件的 module.exports 属性。当不指定main 字段时,默认值是模块根目录下面的index.js 文件。
files 字段用于描述我们使用 npm publish 命令后推送到 npm 服务器的文件列表,如果指定文件夹,则文件夹内的所有内容都会包含进来。我们可以查看下载的 antd 的 package.json 的files 字段,内容如下:
"files": [ "dist", "lib", "es" …… ],
可以看到下载后的 antd 包是下面的目录结构中包含了 /dist/"lib/es文件,另外,我们还可以通过配置一个 .npmignore 文件来排除一些文件, 防止大量的垃圾文件推送到 npm 上。
一般公司的非开源项目,都会设置 private 属性的值为 true,这是因为 npm 拒绝发布私有模块,通过设置该字段可以防止私有模块被无意间发布出去。
使用 os 属性可以指定模块适用系统的系统,或者指定不能安装的系统黑名单(当在系统黑名单中的系统中安装模块则会报错)
"os" : [ "darwin", "linux" ] # 适用系统 "os" : [ "!win32" ] # 黑名单
在 node 环境下可以使用 process.platform 来判断操作系统
我们可以用 cpu 字段更精准的限制用户安装环境
"cpu" : [ "x64", "ia32" ] # 适用 cpu "cpu" : [ "!arm", "!mips" ] # 黑名单
在 node 环境下可以使用 process.arch 来判断 cpu 架构
防止因node 版本不同,导致会出现很多奇奇怪怪的问题(如某些依赖安装报错、依赖安装完项目跑不起来等)。
"engines": { "node": ">= 8.16.0", "npm": ">= 6.9.0" },
需要注意的是,engines属性仅起到一个说明的作用,当用户版本不符合指定值时也不影响依赖的安装
bin 字段用来指定各个内部命令对应的可执行文件的位置。主要应用在脚手架搭建中,当package.json 提供了 bin 字段后,即相当于做了一个命令名和本地文件名的映射。 当用户安装带有 bin 字段的包时,
如果要使用 mfd-cli 作为命令时,可以配置以下 bin 字段:
"bin": { "mfd-cli": "./bin/cli.js" }
上面代码指定,mfd-cli 命令对应的可执行文件为 bin 子目录下的 cli.js,因此在安装了 mfd-cli 包的项目中,就可以很方便地利用 npm执行脚本:
"scripts": { start: 'node node_modules/.bin/mfd-cli' }
这里看起来和 vue create/create-react-app之类的命令不太一样?是因为:当需要 node 环境时就需要加上 node 前缀如果加上 node 前缀,就需要指定mfd-cli 的路径 -> node_modules/.bin,否则 node mfd-cli会去查找当前路径下的 mfd-cli.js,这样肯定是不对。若要实现像 vue create/create-react-app之类的命令一样简便的方式,则可以在上文提到的 bin 子目录下可执行文件cli.js 中的第一行写入以下命令:#!/usr/bin/env node
这行命令的作用是告诉系统用 node 解析,这样命令就可以简写成 mfd-cli 了。
当我们使用 create-react-app 脚手架搭建的 React 项目,默认是使用内置的 webpack 配置,当package.json 中不配置 homepage 属性时,build 打包之后的文件资源应用路径默认是/
。
一般来说,我们打包的静态资源会部署在 CDN 上,为了让我们的应用知道去哪里加载资源,则需要我们设置一个根路径,这时可以通过 package.json 中的 homepage 字段设置应用的根路径。
当我们设置了 homepage 属性后:
{ "homepage": "https://xxxx.cdn/project-name", }
打包后的资源路径就会加上 homepage 的地址:/project-name/bundle.js
為什麼有了package.json,還需要package-lock.json檔案呢,當node_modules資料夾並不存在或被刪除時,需要用到npm install重新裝載全部依賴時,透過package-lock.json可以直接表明下載地址和相關依賴,相對下載速度也更快,也不容易報錯。
更多程式相關知識,請造訪:程式設計影片! !
以上是一文帶你了解nodejs中的package.json的詳細內容。更多資訊請關注PHP中文網其他相關文章!