npx & yarn create & npm init

亖混子發表於2022-01-28
YarnNPM

TL;DR：

? npx xxx

? yarn create

? npm init

以 create-react-app 為例, 文件提供三種建立應用程式的方案：

  • npx create-react-app my-app
  • npm init react-app my-app
  • yarn create react-app my-app

都好用，為啥呢？

npx

NPM (Node Package Manager) and NPX (Node Package Executor)

NPX 是包的執行器。試一下~

// npx cowsay 亖混子
npx: 41 安裝成功，用時 6.739 秒
 _______________
< 亖混子 >
 ---------------
        \   ^__^
         \  (oo)\_______
            (__)\       )\/\
                ||----w |
                ||     ||

用途一、以簡短的方式執行本地包的命令

若執行專案依賴包的執行檔案，需要鍵入以下內容：$ ./node_modules/.bin/jest ; 若使用 npx 將會非常簡潔 $ npx jest

用途二、 一次性執行全域性模組命令

有些全域性包如 create-react-app 使用頻率低，在需要時用 npx 即可 。對比全域性安裝，可保證使用最新版本

$ npx create-react-app my-react-app

yarn create

用 create-* 的包快速建立專案。

使用方式 yarn create <starter-kit-package> [<args>]

命令底層做了兩件事情：

  1. 全域性安裝 starter-kit-package 包，若本地已存在，嘗試更新到最新版本
  2. 執行包的可執行檔案

yarn create react-app my-app 和下面的指令碼等價

$ yarn global add create-react-app
$ create-react-app my-app

npm init

用 create-* 包快速建立專案。和 yarn create 的作用和操作完全一樣

npm init react-app my-app 等同於 yarn create react-app my-app

對比

npm init 和 yarn create 均利用包名規則 create-*，先全域性下載、再執行

npx xxx沒有包名約束，臨時下載、執行後刪除

三者效果一樣，均使用最新包執行命令

相關文章