成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

你可能不知道的 npm 實(shí)用技巧

NickZhou / 1570人閱讀

摘要:但這并不意味著依賴版本是鎖死的。黃色表示不符合指定的語義化版本范圍,比如大版本升級,升級可能會遇到兼容性問題。文件可以列出不想打包的文件,避免把一些無關(guān)的文件發(fā)布到上。

作者: LeanCloud weakish

分享一些 npm 包管理工具的實(shí)用小竅門,希望能夠略微提高下前端、Node.js 開發(fā)者的生活質(zhì)量。

絕大多數(shù)前端和 Node.js 開發(fā)者每天的日常工作都離不開 npm,不知道你對 npm 的觀感如何?如果你覺得 npm 很棒,那么不妨看下這篇文章,說不定其中有你之前沒留意過的小竅門,可以讓你 npm 用得更順手。如果你覺得 npm 很糟糕,那也可以看下這篇文章,也許會發(fā)現(xiàn)用上一些小技巧,npm 會變得稍微不那么糟糕。

npm ci

別被它的名字騙了。npm ci 并不僅僅適用于持續(xù)集成系統(tǒng),在日常開發(fā)中,npm ci 非常實(shí)用。和 npm install 不同,npm ci 根據(jù) package-lock.json 安裝依賴,這可以保證整個(gè)開發(fā)團(tuán)隊(duì)都使用版本完全一致的依賴,避免把時(shí)間浪費(fèi)在排查因?yàn)橐蕾嚥灰恢露鴮?dǎo)致的各種奇怪問題上。不僅如此,npm ci 還有一個(gè)很好的副作用,加快 node 模塊安裝速度。因?yàn)?npm ci 直接根據(jù) package-lock.json 中指定的版本安裝,無需計(jì)算求解依賴滿足問題,在大多數(shù)情況下都可以大大加速 node 模塊安裝過程。如果你曾經(jīng)因?yàn)橄?npm install 太慢而換用兼容性不那么好的 yarn 以及兼容性更不好的 pnpm,那么不妨試下 npm ci,也許你會發(fā)現(xiàn),其實(shí) npm 也可以不那么慢。

另外,如果 package-lock.json 過時(shí)(和 package.json 沖突),那么 npm ci 會很貼心地報(bào)錯,避免項(xiàng)目依賴陷入過時(shí)狀態(tài)。

有了 npm ci,基本上我只在引入新依賴時(shí)才使用 npm install

注意,npm ci 在安裝前會自動清除現(xiàn)存的 node_modules,所以 npm ci 天然規(guī)避了增量安裝可能帶來的不一致性等問題。(這也意味著,你又可以少記一條命令 npm prune。)不過,如果你的網(wǎng)絡(luò)很慢,那可能就不那么妙了。別慌,你可以用 --prefer-offline,最大限度地利用 npm 的全局緩存加速安裝過程。

當(dāng)然,既然使用 npm ci,那就別忘了把 package-lock.json 加入 git 倉庫。

npm outdated

npm ci 基于 package-lock.json 鎖定依賴版本,確保項(xiàng)目開發(fā)環(huán)境的一致性。但這并不意味著依賴版本是鎖死的。為了利用新版本帶來的問題修復(fù)、新特性以及性能提升,定期還是需要升級依賴版本的。在這一場景下,推薦使用 npm outdated。它會列出還沒有升到當(dāng)前最新版本的項(xiàng)目依賴。紅色表示符合指定的語義化版本范圍,理論上可以無腦升級(npm update 會一次性升級所有紅色依賴)。黃色表示不符合指定的語義化版本范圍,比如大版本升級,升級可能會遇到兼容性問題。

有些項(xiàng)目處于維護(hù)階段,不打算加新特性了,甚至可能不太嚴(yán)重的問題都不打算修復(fù)了,但是像安全漏洞這樣的嚴(yán)重問題還是要管的。這時(shí)可以使用 npm audit 命令,列出項(xiàng)目依賴中有安全漏洞的版本。處于活躍開發(fā)階段的項(xiàng)目當(dāng)然也需要關(guān)注安全漏洞問題,但是因?yàn)?npm install 引入新依賴時(shí)會自動運(yùn)行 npm audit,再加上會定期運(yùn)行 npm outdated,所以手動運(yùn)行 npm audit 的機(jī)會不太多。

npx

前面說過基本上只在引入新依賴時(shí)才使用 npm install,沒有提到全局安裝。全局安裝當(dāng)然也需要使用 npm install。不過,為了確保開發(fā)環(huán)境的一致性,npm install --global 應(yīng)當(dāng)慎用。個(gè)人建議僅僅在安裝一些日常使用的工具時(shí)才使用全局安裝,而項(xiàng)目開發(fā)所需的工具,則作為開發(fā)依賴安裝,然后使用 npx 調(diào)用。

不推薦:

npm install --global webpack
webpack ...

推薦:

npm i -D webpack
npx webpack ...

這里 i -Dinstall --save-dev 的簡寫形式。

對于一些一次性的臨時(shí)任務(wù),可以直接通過 npx 運(yùn)行相應(yīng)工具,免去了手動安裝的麻煩,也不會污染 devDependencies

例如,之前項(xiàng)目使用 webpack 打包,現(xiàn)在想臨時(shí)試下?lián)Q用 rollup 打包的效果:

npx rollup ...

npx 很智能,如果路徑中找不到 rollup,會自動安裝。

npx 用來測試不同版本的兼容性時(shí)非常好用。下面是一些例子。

需要用到的 cowsay 的某個(gè)特性或修復(fù)已經(jīng)合入 GitHub 主線,但是還沒在 npmjs 上發(fā)新版,試一下:

npx github:piuccio/cowsay

臨時(shí)測下內(nèi)部維護(hù)的 cowsay 的一個(gè)分支:

npx git+ssh://my.hosted.git:cowsay.git#semver:^1

當(dāng)前使用的是 node 的 LTS 版本(10),想試下 node 12 下構(gòu)建腳本能不能跑起來:

npx -p node@12 npm run build

從上面我們可以看到,當(dāng)包名和命令名不同時(shí)(npm 命令由 node 提供),可以用 -p 選項(xiàng)指定包名。

npm run

package.jsonscripts 屬性中加入命令(例如:"foo": "echo foo")就可以通過 npm run foo 運(yùn)行對應(yīng)命令。這是 npm 提供的一個(gè)很方便的運(yùn)行項(xiàng)目相關(guān)的自動化任務(wù)的機(jī)制,有一點(diǎn)類似 make。不過直接運(yùn)行 make (不帶任何參數(shù))會運(yùn)行默認(rèn)任務(wù),但直接運(yùn)行 npm run (不帶任何參數(shù))會列出所有在 scripts 中聲明的命令。

; npm run
Lifecycle scripts included in leancloud-realtime:
  test
    npm run lint && npm run build && npm run docs && npm run test:node && npm run test:browser

available via `npm run-script`:
  precommit
    pretty-quick --staged
  commitmsg
    commitlint -e $GIT_PARAMS
  lint
    eslint --ignore-path .gitignore src test plugins && tsc realtime.d.ts --strict
  ...
其他

這里還有一些我個(gè)人覺得不是特別實(shí)用的小竅門,不過,每個(gè)人的需求和偏好不同,說不定你會覺得它們挺有用的。如果你有想要分享的竅門,歡迎留言。

npm init -y 默認(rèn)情況下,npm init 會讓你回答一些問題。npm init -y 可以跳過這些問題,直接上手開發(fā)。我之所以不推薦它,是因?yàn)?,如果你打算盡快上手開發(fā)一個(gè)應(yīng)用,絕大多數(shù)情況下會用框架,而幾乎所有框架在 npmjs 上都至少有一個(gè) create-xxx-app 包。所以基本上你沒有機(jī)會輸入 npm init 去回答那些問題。而如果你打算寫一個(gè)組件或庫,那么 package.json 中的元信息對組件或庫的使用者很重要(即使是僅供你自己使用的組件或庫,未來的你也未必記得當(dāng)初寫這個(gè)組件或庫的上下文),跳過這些問題并不是一個(gè)好主意。當(dāng)然,急躁是程序員的三大美德,你也許會想,我可以在完成開發(fā)后再來補(bǔ)這些。但是,一般來說,往往項(xiàng)目開始的時(shí)候是你最有興趣(或者說,稍微不那么反感)記錄這些上下文的時(shí)刻。如果在項(xiàng)目開始的時(shí)候都不耐煩做這個(gè),開發(fā)完成后,很可能就更沒興趣了。同理,README 也應(yīng)該在項(xiàng)目開始前寫。

npm repo 可以打開項(xiàng)目的源代碼倉庫(大部分情況下是 GitHub),它還有一個(gè)姊妹命令,npm home,可以打開項(xiàng)目的主頁。不過,我個(gè)人覺得,比起這兩個(gè)命令,通常而言, IDE 或者編輯器的智能提示(速覽類型、速覽文檔、速覽定義之類)更高效。

.npmignore 文件可以列出不想打包的文件,避免把一些無關(guān)的文件發(fā)布到 npmjs 上。但是,統(tǒng)一使用 .gitignore 可以滿足絕大部分場景下的需求。而且,只存在 .gitignore 的情況下,npm publish 會尊重 .gitignore 的聲明,而 .npmignore.gitignore 同時(shí)存在的情況下,npm publish 會忽略 .gitignore,而不是取兩者的并集。換言之,.gitignore 中忽略但 .npmignore 中未忽略的文件會被打包發(fā)布。所以,使用 .npmginore 就意味著需要同時(shí)小心翼翼地維護(hù)兩份大部分內(nèi)容重復(fù)的列表。同時(shí),一旦團(tuán)隊(duì)中有任何一人因?yàn)榕既坏氖韬龌蛘卟皇煜?.npmignore.gitignore 關(guān)系的細(xì)節(jié)出現(xiàn)了失誤,那就有可能將敏感信息發(fā)布到 npmjs 上,導(dǎo)致安全事故。

各種 npm 命令的快捷版本,比如上文用到的 npm i -D。這些個(gè)人覺得不用專門刻意去記。經(jīng)常輸入的命令,可以 npm help 一下看看有沒有簡短版本。不查也沒有關(guān)系,npm tnpm test 乃至 npm run test 的區(qū)別絕不是開發(fā)效率的瓶頸所在。很多時(shí)候這只是個(gè)人偏好問題,比如追求盡可能少打字的人會喜歡 npm t,追求盡可能少記東西的人會喜歡 npm run test (永遠(yuǎn)不會因?yàn)檎`以為 npm build 表示 npm run build 而碰到問題),其他人可能會喜歡 npm test 這樣中庸的選項(xiàng)。

npm xmas 猜猜輸入這個(gè)命令會得到什么結(jié)果?你可以親自試一下。提示:這個(gè)命令完全沒有實(shí)用性可言。;-)

文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/105287.html

相關(guān)文章

  • 13 個(gè) npm 快速開發(fā)技巧

    摘要:每天,數(shù)以百萬計(jì)的開發(fā)人員使用或來構(gòu)建項(xiàng)目。在本文中,我們將會介紹的個(gè)技巧來最大限度地利用從簡單的快捷方式到自定義腳本。保存為開發(fā)依賴常規(guī),簡寫。首先通過安裝開發(fā)依賴。在下一個(gè)也是最后一個(gè)技巧中,我們將合并。 為了保證的可讀性,本文采用意譯而非直譯。 每天,數(shù)以百萬計(jì)的開發(fā)人員使用 npm 或 yarn 來構(gòu)建項(xiàng)目。運(yùn)行npm init或npx create- response -ap...

    luck 評論0 收藏0
  • 2018年應(yīng)該知道11個(gè)Javascript實(shí)用程序庫

    摘要:構(gòu)建是為了在中為常見任務(wù)提供實(shí)用程序功能。所有功能都自動進(jìn)行,并且相應(yīng)地安排傳遞的參數(shù)以便于使用。在星級,是一個(gè)用于處理本機(jī)對象的實(shí)用程序庫。該庫沒有外部依賴關(guān)系,這是一個(gè)將事件作為序列進(jìn)行測試的現(xiàn)場演示。 由于Javascript在2018年仍然是最受歡迎和最廣泛使用的編程語言,因此圍繞它擴(kuò)展了生態(tài)系統(tǒng)。 showImg(https://segmentfault.com/img/re...

    Ali_ 評論0 收藏0
  • 2018年應(yīng)該知道11個(gè)Javascript實(shí)用程序庫

    摘要:構(gòu)建是為了在中為常見任務(wù)提供實(shí)用程序功能。所有功能都自動進(jìn)行,并且相應(yīng)地安排傳遞的參數(shù)以便于使用。在星級,是一個(gè)用于處理本機(jī)對象的實(shí)用程序庫。該庫沒有外部依賴關(guān)系,這是一個(gè)將事件作為序列進(jìn)行測試的現(xiàn)場演示。 由于Javascript在2018年仍然是最受歡迎和最廣泛使用的編程語言,因此圍繞它擴(kuò)展了生態(tài)系統(tǒng)。 showImg(https://segmentfault.com/img/re...

    Yumenokanata 評論0 收藏0
  • 知道前端SDK開發(fā)技巧

    摘要:一個(gè)帶提示的最后對于開發(fā)同學(xué)來說,就算不使用,也強(qiáng)烈建議使用提供注解,它會通過一些類型推導(dǎo)來檢查你的代碼的正確性,可以減少很多開發(fā)過程中的。相對于對象,它保證了輸入的類型你定義的對象可能某一天不再只有類型的,不再需要額外的類型判斷。 作者:陳達(dá)孚 香港中文大學(xué)研究生,《移動Web前端高效開發(fā)實(shí)戰(zhàn)》作者之一,《前端開發(fā)者指南2017》譯者之一,在中國前端開發(fā)者大會,中生代技術(shù)大會等技術(shù)...

    jokester 評論0 收藏0
  • Vue項(xiàng)目搭建、只需四步輕松搞定!

    摘要:你只要算好各種食材的比例,不用關(guān)心做菜的過程,就是那個(gè)微波爐。項(xiàng)目搭建步驟官網(wǎng)官網(wǎng)開發(fā)環(huán)境安裝配置項(xiàng)目配置如圖所示運(yùn)行項(xiàng)目開發(fā)編譯在瀏覽器輸入看到,就跑通了。從基礎(chǔ)開始,循序漸進(jìn),含有常用實(shí)戰(zhàn)項(xiàng)目,貼近企業(yè)真實(shí)現(xiàn)狀。 用一個(gè)完成的Vue系列文章,讓大家全面理解Vue的實(shí)現(xiàn)原理,掌握實(shí)用技巧,能在實(shí)戰(zhàn)中使用Vue,解鎖一個(gè)開發(fā)技能。文末有文章大綱請查看。不墨跡了!馬上寫內(nèi)容: 1.為什...

    張巨偉 評論0 收藏0

發(fā)表評論

0條評論

閱讀需要支付1元查看
<