Javascript模塊化開發1——package.json詳解

来源:https://www.cnblogs.com/studynote/archive/2019/11/15/11866682.html
-Advertisement-
Play Games

一、環境安裝 Node.js 安裝包及源碼下載地址為: "https://nodejs.org/en/download/" 。 在該頁面你可以根據不同平臺系統選擇你需要的 Node.js 安裝包。 Node.js裡面集成了npm,npm是一種包管理工具,允許用戶從NPM伺服器下載別人編寫的包或命令行 ...


一、環境安裝

Node.js 安裝包及源碼下載地址為:https://nodejs.org/en/download/
在該頁面你可以根據不同平臺系統選擇你需要的 Node.js 安裝包。
Node.js裡面集成了npm,npm是一種包管理工具,允許用戶從NPM伺服器下載別人編寫的包或命令行程式並分享自己編寫的包或命令行程式。

二、創建模塊

輸入命令npm init後根據提示輸入相關信息,如名稱,描述,版本等,將會創建一個初始的package.json。
接著可以編輯相關屬性來定義該模塊,大多數的屬性都很直觀,下麵只挑幾個進行說明:

1.name

項目/模塊名稱。
命名規範如下:

  • 名稱可以首碼scope標識,如@myorg/mypackage。
  • 名字也將作為require()命令的參數,所以應該儘量簡明,長度必須小於等於214個字元。
  • 名字將會被作為url的一部分,所有要符合http url的一般命名規則,不能包含url非法字元,也不能以"."(點)或者"_"(下劃線)開頭。
  • 不能包含大寫字母。
  • 名字里不要再包含"js"和"node",且不要用和核心Node模塊相同的名字。
  • 如果包要發佈到NPM平臺上的話,最好先訪問https://www.npmjs.com/檢查下有沒有重名。

2.repository

用於指示代碼存放的位置。

 "repository": {
  "type": "git",
  "url": "https://github.com/***.git"
}
"repository": {
  "type": "svn",
  "url": "https://***"
}

3.private

設為true這個包將不會發佈到NPM平臺下。如果不設置repository,則應該設置private為true。

4.files

包所包含的所有文件,可以取值為文件夾。
通常我們還是用.npmignore來去除不想包含到包里的文件。
不管如何設置,有些文件會永遠都包含在包里:

package.json
README
CHANGES / CHANGELOG / HISTORY
LICENSE / LICENCE
NOTICE
main里包含的文件

不管如何設置,有些文件會永遠都不能包含在包里:

.git
CVS
.svn
.hg
.lock-wscript
.wafpickle-N
..swp
.DS_Store
._

npm-debug.log
.npmrc
node_modules
config.gypi
*.orig
package-lock.json

5.main

main欄位指定了載入的入口文件,require('moduleName')就會載入這個文件。這個欄位的預設值是模塊根目錄下麵的index.js。

6.browser

定義 npm 包在 browser 環境下的入口文件

7.Bin

bin項用來指定各個內部命令對應的可執行文件的位置。很多的包都會有執行文件需要安裝到PATH中去。
這個欄位對應的是一個Map,每個元素對應一個{ 命令名:文件名 },例如:

"bin" : {
  "myapp" : "./cli.js"
}

在安裝第三方帶有bin欄位的npm,那可執行文件會被鏈接到當前項目的./node_modules/.bin中
可通過命令行node node_modules/.bin/myapp執行相關js文件

8.config

可以用來添加命令行的環境變數,例如:

 {
  "name" : "test",
  "config" : { "msg" : "hello" },
  "scripts" : { "start" : "node index.js" }
}

在 index.js 中,我們可以直接使用該環境變數:

console.log(process.env.npm_package_config_msg);

9.dependencies

指定運行時依賴的包。

10.devDependencies

指定開發時依賴的包。

11.peerDependencies

如果你的包是插件,而用戶在使用你的包時候,通常也會需要這些依賴(插件),那麼可以將依賴列到這裡。

12.bundledDependencies

綁定的依賴包,發佈的時候這些綁定包也會被一同發佈。

13.optionalDependencies

可選的依賴,即使這些依賴沒有,也可以正常安裝使用。

14.scripts

定義可被npm run command執行的所有命令,可以通過輸入npm run查看所有的命令列表。
比如下麵定義了運行 npm run start和npm run stop時,所要執行的命令。在cmd下輸入命令npm run start相當於輸入命令node start.js"

"scripts": {
  "start": "node start.js",
  "stop": "node stop.js",
}

scripts命令具有以下特性:

  • 執行npm run command時,會先安裝devDependencies中所定義的依賴的包,再運行command所定義的命令。
    例如:
"scripts": {
  "build": "npm install && grunt"
}

運行npm run build會先安裝devDependencies中定義的一些模塊,然後再運行npm install和grunt。

  • 支持生命周期鉤子
    npm支持pre- 和 post-兩種鉤子,前者是在腳本運行前,後者是在腳本運行後執行。所有的命令腳本都可以使用鉤子(包括自定義的腳本)。
    比如運行npm run build,會按以下順序執行:
    npm run prebuild -> npm run build -> npm run postbuild
  • npm提供了一些針對當前包的內置命令,並設置相關的預設行為。這些預設行為可以在scripts中改寫其行為。
    相關的內置命令有:
    npm start: npm run start的簡寫,如果不在script中配置start,那麼npm start預設執行node server.js
    npm stop: npm run stop的簡寫,執行自定義stop腳本,沒有預設行為。
    npm restart: npm run stop&&npm run restart&&npm run start的簡寫。
    npm test ,npm run test的簡寫,執行自定義test腳本,沒有預設行為。

您的分享是我們最大的動力!

-Advertisement-
Play Games
更多相關文章
  • 本文微信公眾號「AndroidTraveler」首發。 背景 昨天(2019 11 14)上去 GitHub 上面一看,結果來了個下麵的提示: 點進去一看: 看來是自動化構建相關的。 那就試一下,選了第一個 Android CI ,當然測試倉庫是我新建的一個 Android 輪子庫。 編譯報錯了。 ...
  • 精靈圖 1. 為什麼需要精靈圖 為了有效的減少伺服器接收和發送請求的次數,提高頁面的載入速度。出現了CSS精靈技術 2. 精靈圖(sprites)的使用 精靈技術主要針對背景圖片。就是把多個小背景圖片整合到一張大圖片中。 這個大圖片也稱為sprites精靈圖或者雪碧圖 移動背景圖片位置,使用back ...
  • 1、啟動頁面:index.html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <title>hc ...
  • 元素的顯示與隱藏 1. 本質:讓一個元素在頁面中隱藏或顯示出來 2. display:顯示隱藏 用於設置一個元素應如何顯示 display:none;隱藏對象 display:block;隱藏對象 【註意】 display隱藏元素後,不在占有原來的位置 3. visibility:顯示隱藏 visi ...
  • HTTP狀態碼分類 1XX ——信息,伺服器收到請求,需要請求者繼續執行操作 2XX——成功,操作被成功接收並處理 3XX——重定向,需要進一步的操作以完成請求 4XX——客戶端錯誤,請求包含語法錯誤或者無法完成請求 5XX——伺服器錯誤,伺服器在處理請求的過程中發生了錯誤 2XX狀態碼 | 狀態碼 ...
  • 事件發生時會在元素節點之間按照特定的順序傳播,這個傳播過程即DOM事件流。 DOM事件流分為三個階段,分別為: 捕獲階段:事件從Document節點自上而下向目標節點傳播的階段; 目標階段:真正的目標節點正在處理事件的階段; 冒泡階段:事件從目標節點自上而下向Document節點傳播的階段。 捕獲階 ...
  • 一、載入 ui element vue add element 載入過程及成功結果如下 > vue add element> �� Installing vue-cli-plugin-element... > + [email protected] > added 1 pack ...
  • 在安裝vue-cli之前,要先安裝node.js這個大家百度一下就可以了 1、安裝 vue-cli npm install -g @vue/cli-init 2、初始化一個項目,名為 hcmanage ,並選擇使用 webpack 打包方式 vue init webpack hcmanage 3、切 ...
一周排行
    -Advertisement-
    Play Games
  • 移動開發(一):使用.NET MAUI開發第一個安卓APP 對於工作多年的C#程式員來說,近來想嘗試開發一款安卓APP,考慮了很久最終選擇使用.NET MAUI這個微軟官方的框架來嘗試體驗開發安卓APP,畢竟是使用Visual Studio開發工具,使用起來也比較的順手,結合微軟官方的教程進行了安卓 ...
  • 前言 QuestPDF 是一個開源 .NET 庫,用於生成 PDF 文檔。使用了C# Fluent API方式可簡化開發、減少錯誤並提高工作效率。利用它可以輕鬆生成 PDF 報告、發票、導出文件等。 項目介紹 QuestPDF 是一個革命性的開源 .NET 庫,它徹底改變了我們生成 PDF 文檔的方 ...
  • 項目地址 項目後端地址: https://github.com/ZyPLJ/ZYTteeHole 項目前端頁面地址: ZyPLJ/TreeHoleVue (github.com) https://github.com/ZyPLJ/TreeHoleVue 目前項目測試訪問地址: http://tree ...
  • 話不多說,直接開乾 一.下載 1.官方鏈接下載: https://www.microsoft.com/zh-cn/sql-server/sql-server-downloads 2.在下載目錄中找到下麵這個小的安裝包 SQL2022-SSEI-Dev.exe,運行開始下載SQL server; 二. ...
  • 前言 隨著物聯網(IoT)技術的迅猛發展,MQTT(消息隊列遙測傳輸)協議憑藉其輕量級和高效性,已成為眾多物聯網應用的首選通信標準。 MQTTnet 作為一個高性能的 .NET 開源庫,為 .NET 平臺上的 MQTT 客戶端與伺服器開發提供了強大的支持。 本文將全面介紹 MQTTnet 的核心功能 ...
  • Serilog支持多種接收器用於日誌存儲,增強器用於添加屬性,LogContext管理動態屬性,支持多種輸出格式包括純文本、JSON及ExpressionTemplate。還提供了自定義格式化選項,適用於不同需求。 ...
  • 目錄簡介獲取 HTML 文檔解析 HTML 文檔測試參考文章 簡介 動態內容網站使用 JavaScript 腳本動態檢索和渲染數據,爬取信息時需要模擬瀏覽器行為,否則獲取到的源碼基本是空的。 本文使用的爬取步驟如下: 使用 Selenium 獲取渲染後的 HTML 文檔 使用 HtmlAgility ...
  • 1.前言 什麼是熱更新 游戲或者軟體更新時,無需重新下載客戶端進行安裝,而是在應用程式啟動的情況下,在內部進行資源或者代碼更新 Unity目前常用熱更新解決方案 HybridCLR,Xlua,ILRuntime等 Unity目前常用資源管理解決方案 AssetBundles,Addressable, ...
  • 本文章主要是在C# ASP.NET Core Web API框架實現向手機發送驗證碼簡訊功能。這裡我選擇是一個互億無線簡訊驗證碼平臺,其實像阿裡雲,騰訊雲上面也可以。 首先我們先去 互億無線 https://www.ihuyi.com/api/sms.html 去註冊一個賬號 註冊完成賬號後,它會送 ...
  • 通過以下方式可以高效,並保證數據同步的可靠性 1.API設計 使用RESTful設計,確保API端點明確,並使用適當的HTTP方法(如POST用於創建,PUT用於更新)。 設計清晰的請求和響應模型,以確保客戶端能夠理解預期格式。 2.數據驗證 在伺服器端進行嚴格的數據驗證,確保接收到的數據符合預期格 ...