站長資訊網
        最全最豐富的資訊網站

        一文帶你了解npm的原理

        npm 是 JavaScript世界的包管理工具,并且是 Node.js平臺的默認包管理工具。通過 npm可以安裝、共享、分發代碼,管理項目依賴關系。本篇文章帶大家了解一下npm的原理,希望對大家有所幫助!

        一文帶你了解npm的原理

        npm的原理

        npm據稱成為世界最大的包管理器?原因真的只是用戶友好?

        一、npm init

        用來初始化一個簡單的package.json文件。package.json文件用來定義一個package的描述文件。

        1、npm init的執行的默認行為

        執行npm init --yes,全部使用默認的值。

        2、 自定義npm init行為

        npm init命令的原理是:調用腳本,輸出一個初始化的package.json文件。

        獲取用戶輸入使用prompt()方法。

        二、依賴包安裝

        npm的核心功能:依賴管理。執行npm i從package.json中dependencies和devDependencies將依賴包安裝到當前目錄的node_modules文件夾中。

        2.1、package定義

        npm i 就可以安裝一個包。通常package就是我們需要安裝的包名,默認配置下npm會從默認的源(Registry)中查找該包名的對應的包地址,并且下載安裝。 還可以是一個指向有效包名的http url/git url/文件夾路徑。

        package的準確定義,符合以下a)到g)其中一個條件,他就是一個package:

        一文帶你了解npm的原理

        package的準確定義

        2.2、安裝本地包/遠程git倉庫包

        共享依賴包,并非非要把包發布到npm源上才能使用。

        1)、場景1:本地模塊引用

        開發中避免不了模塊之間調用,開發中,我們把頻繁調用的配置模塊放在根目錄,然后如果有很多層級目錄,后來引用

        const config = require(''../../../../..config)

        這樣的路徑引用不利于代碼重構。這時候我們需要考慮把這個模塊分離出來供其他模塊共享。比如config.js可以封裝成一個package放到node_modules目錄下。

        不需要手動拷貝或者創建軟連接到node_modules目錄,npm 有自己的解決方案:

        方案:

        1、新增config文件夾,將config.js移入文件夾,名字修改為index.js,創建package.json定義config包

        {      "name": "config",      "main": "index.js",      "version": "0.1.0"  }

        2、在項目的package.json新增依賴項,然后執行npm i。

        {    "dependencies": {      "config":"file: ./config"    }  }

        查看 node_modules 目錄我們會發現多出來一個名為 config,指向上層 config/ 文件夾的軟鏈接。這是因為 npm 識別 file: 協議的url,得知這個包需要直接從文件系統中獲取,會自動創建軟鏈接到 node_modules 中,完成“安裝”過程。

        2)、場景2:私有git共享package

        團隊內會有一些代碼/公用庫需要在團隊內不同項目間共享,但可能由于包含了敏感內容。

        我們可以簡單的將被依賴的包托管到私有的git倉庫中,然后將git url保存到dependencies中。npm會直接調用系統的git命令從git倉庫拉取包的內容到node_modules中。

        npm支持的git url格式:

        <protocol>://[<user>[:<password>]@]<hostname>[:<port>][:][/]<path>[#<commit-ish> | #semver:<semver>]

        git 路徑后可以使用 # 指定特定的 git branch/commit/tag, 也可以 #semver: 指定特定的 semver range.

        比如:

        git+ssh://git@github.com:npm/npm.git#v1.0.27  git+ssh://git@github.com:npm/npm#semver:^5.0  git+https://isaacs@github.com/npm/npm.git  git://github.com/npm/npm.git#v1.0.27

        3)、場景3:開源package問題修復

        此時我們可以手動進入 node_modules 目錄下修改相應的包內容,也許修改了一行代碼就修復了問題。但是這種做法非常不明智!

        方案:

        fork原作者的git庫,在自己的repo修復問題,然后將dependencies中的相應依賴改為自己修復后版本的git url就可以解決問題。

        三、npm install如何工作

        npm i執行完畢,node_modules中看到所有的依賴包。開發人員無關注node_modules文件夾的結構細節,關注業務代碼中引用依賴包。

        理解node_modules結構幫助我們更好理解npm如何工作。npm2到npm5變化和改進。

        3.1 npm2

        npm2在安裝依賴包,采用的是簡單的遞歸安裝方法。每一個包都有自己的依賴包,每一個包的依賴都安裝在自己的node_modules中,依賴關系層層遞進,構成整個依賴樹,這個依賴樹與文件系統中的文件結構樹一一對應。

        最方便的依賴樹的方式在根目錄下執行npm ls

        優點:

        • 層級結構明顯,便于傻瓜式管理。

        缺點:

        • 復雜工程,目錄結構可能太深,深層的文件路徑過長觸發window文件系統中文件路徑不能超過260個字符長。

        • 部分被多個包依賴的包在很多地方重復安裝,造成大量的冗余。

        3.2 npm3

        npm3的node_modules目錄改成更加扁平狀層級結構。npm3在安裝的時候遍歷整個依賴樹,計算最合理的文件夾安裝方式,所有被重復依賴的包都可以去重安裝。

        npm來說,同名不同版本的包是兩個獨立的包。

        npm3的依賴樹結構不再與文件夾層級一一對應。

        3.3 npm5

        沿用npm3的扁平化依賴包安裝方式。最大的變化時增加package-lock.json文件。

        package-lock.json作用:鎖定依賴安裝結構,發現node_modules目錄文件層級結構是與json的結構一一對應。

        npm5默認會在執行npm i后生成package-lock.json文件,提交到git/svn代碼庫。

        要升級,不要使用 5.0版本。

        注意:在 npm 5.0 中,如果已有 package-lock 文件存在,若手動在 package.json 文件新增一條依賴,再執行 npm install, 新增的依賴并不會被安裝到 node_modules 中, package-lock.json 也不會做相應的更新。

        四、依賴包版本管理

        介紹依賴包升級管理相關知識。

        4.1 語義化版本semver

        npm依賴管理的一個重要特性采用語義化版本(semver)規范,作為版本管理方案。

        語義化版本號必須包含三個數字,格式:major.minor.patch。意思是:主版本號.小版本號.修改版本號。

        我們需要在dependencies中使用semver約定的指定所需依賴包的版本號或者范圍。

        常用的規則如下圖:

        一文帶你了解npm的原理

        semver語義化版本

        1、任意兩條規則,用空格連接起來,表示“與”邏輯,即為兩個規則的交集。

        如 >=2.3.1 <=2.8.0 可以解讀為: >=2.3.1 且 <=2.8.0

        • 可以匹配 2.3.1, 2.4.5, 2.8.0
        • 但不匹配 1.0.0, 2.3.0, 2.8.1, 3.0.0

        2、任意兩條規則,用||連接起來,表示“或”邏輯,即為兩條規則的并集。

        如 ^2 >=2.3.1 || ^3 >3.2

        • 可以匹配 2.3.1, 2,8.1, 3.3.1
        • 但不匹配 1.0.0, 2.2.0, 3.1.0, 4.0.0

        3、更直觀的表示版本號范圍的寫法

        • 或 x 匹配所有主版本
        • 1 或 1.x 匹配 主版本號為 1 的所有版本
        • 1.2 或 1.2.x 匹配 版本號為 1.2 開頭的所有版本

        4、在 MAJOR.MINOR.PATCH 后追加 – 后跟點號分隔的標簽,作為預發布版本標簽 通常被視為不穩定、不建議生產使用的版本。

        • 1.0.0-alpha
        • 1.0.0-beta.1
        • 1.0.0-rc.3

        4.2 依賴版本升級

        在安裝完一個依賴包之后有新的版本發布了,如何使用npm進行版本升級呢?

        • npm i或者npm update,但是不同的npm版本,不同的package.json和package-lock.json文件,安裝和升級表現是不同的。

        使用npm3的結論:

        • 如果本地 node_modules 已安裝,再次執行 install 不會更新包版本, 執行 update 才會更新; 而如果本地 node_modules 為空時,執行 install/update 都會直接安裝更新包。
        • npm update 總是會把包更新到符合 package.json 中指定的 semver 的最新版本號——本例中符合 ^1.8.0 的最新版本為 1.15.0
        • 一旦給定 package.json, 無論后面執行 npm install 還是 update, package.json 中的 webpack 版本一直頑固地保持 一開始的 ^1.8.0 巋然不動

        使用npm5的結論:

        • 無論何時執行 install, npm 都會優先按照 package-lock 中指定的版本來安裝 webpack; 避免了 npm 3 表中情形 b) 的狀況;
        • 無論何時完成安裝/更新, package-lock 文件總會跟著 node_modules 更新 —— (因此可以視 package-lock 文件為 node_modules 的 JSON 表述)
        • 已安裝 node_modules 后若執行 npm update,package.json 中的版本號也會隨之更改為 ^1.15.0

        4.3 最佳實踐

        我常用的node是8.11.x,npm是5.6.0。

        • 使用npm >= 5.1 版本,保持package-lock.json文件默認開啟配置。
        • 初始化,npm i 安裝依賴包,默認保存^X.Y.Z,項目提交package.json和package-lock.json。
        • 不要手動修改package-lock.json

        升級依賴包:

        • 升級小版本,執行npm update升級到新的小版本。
        • 升級大版本,執行npm install @ 升級到新的大版本。
        • 手動修改package.json中的版本號,然后npm i。
        • 本地驗證升級新版本后沒有問題,提交新的package.json和package-lock.json文件。

        降級依賴包:

        • 正確:npm i @驗證沒有問題后,提交package.json和package-lock.json文件。
        • 錯誤:修改package.json中的版本號,執行npm i不會生效。因為package-lock.json鎖定了版本。

        刪除依賴包:

        • A計劃:npm uninstall 。提交package.json和package-lock.json。
        • B計劃:在package.json中刪除對應的包,然后執行npm i,提交package.json和package-lock.json。

        五、npm的sctipts

        5.1 基本使用

        npm scripts是npm的一個重要的特性。在package.json中scripts字段定義一個腳本。

        比如:

        {      "scripts": {          "echo": "echo HELLO WORLD"      }  }

        我們可以通過npm run echo 命令執行這段腳本,就像shell中執行echo HELLO WOLRD,終端是可以看到輸出的。

        總結如下:

        • npm run 命令執行時,會把./node_modules/.bin目錄添加到執行環境的PATH變量中。全局的沒有安裝的包,在node_modules中安裝了,通過npm run 可以調用該命令。
        • 執行npm 腳本時要傳入參數,需要在命令后加 — 表明,比如 npm run test — –grep="pattern" 可以將–grep="pattern"參數傳給test命令。
        • npm 還提供了pre和post兩種鉤子的機制,可以定義某個腳本前后的執行腳本。
        • 運行時變量:npm run 的腳本執行環境內,可以通過環境變量的方式獲取
        贊(0)
        分享到: 更多 (0)
        網站地圖   滬ICP備18035694號-2    滬公網安備31011702889846號
        主站蜘蛛池模板: 国产在线精品网址你懂的| 亚洲自偷自偷精品| 久久精品一区二区三区不卡| 久久伊人精品青青草原日本| 九九热在线精品视频| 久久精品国产久精国产思思| 久久乐国产精品亚洲综合| 91精品一区二区综合在线| 99久久精品国产高清一区二区 | 91精品全国免费观看青青| 亚洲欧美日韩国产精品| 精品精品国产欧美在线小说区| 国产欧美久久久精品| 精品国产a∨无码一区二区三区| 在线亚洲精品自拍| 久久精品国产精品亚洲| 国产精品无码专区在线观看| 91国内揄拍国内精品对白不卡| 国产成人精品高清在线观看99 | 一本一道久久精品综合| 99国产精品一区二区| 国产精品国色综合久久| 久久综合国产乱子伦精品免费 | 亚洲日韩国产精品乱| 另类国产精品一区二区| 国产午夜福利精品久久| 99精品电影一区二区免费看| 91精品啪在线观看国产电影| 一本久久a久久精品综合夜夜| 日韩精品久久久久久| 青草青草久热精品视频在线网站| 成人国产精品一区二区网站| 国产成人vr精品a视频| .精品久久久麻豆国产精品| 99RE6热在线精品视频观看| 99re热视频这里只精品| 国产亚洲综合成人91精品| 精品999久久久久久中文字幕| 欧美亚洲国产精品久久蜜芽| 中文字幕精品一区影音先锋| 国产精品亚洲精品日韩已方|