[TOC] # 簡介 2009年，美國程序員Ryan Dahl創造了[node.js](node.js)項目，將javascript語言用于服務器端編程。 這標志"Javascript模塊化編程"正式誕生：在服務器端，一定要有模塊，與操作系統和其他應用程序互動，否則根本沒法編程。 # node 多版本切換 [Volta Alternatives and Reviews (Mar 2022) (libhunt.com)](https://www.libhunt.com/r/volta) [Schniz/fnm: ?? Fast and simple Node.js version manager, built in Rust (github.com)](https://github.com/Schniz/fnm) # 安裝 包 安裝開發時的依賴：`npm i --save-dev xxxx` 簡寫：`npm i -D xxxx` 安裝生產時的依賴：`npm i --save xxxx` 簡寫：`npm i -S xxx` - `--save-dev` 是對對開發環境所需依賴的聲明（構建工具，測試工具）（會刷新`package.json`文件）， - `--save` 是生產環境所需依賴的聲明（開發應用中使用的框架，庫）（會刷新`package.json`文件）。 - 使用`npm i`時，會下載 dependencies 和 devDependencies 中的模塊； - 使用`npm i --production`或者注明`NODE_ENV`變量值為`production`時，只會下載 dependencies 中的模塊。 比如，你寫 ES6 代碼，如果你想編譯成 ES5 發布那么 babel 就是 devDependencies。 如果你用了 jQuery，由于發布之后還是依賴 jQuery，所以是 dependencies (默認安裝位置，[參考](https://www.npmjs.cn/cli/install/))。 但是在 npm 里面除了二進制的依賴，似乎也不用區分是不是dev。 因為使用npm就是自己編譯的意思，而不使用npm直接拿編譯后的版本的，這些依賴項也看不到。 > `-P, --save-prod`: Package will appear in your`dependencies`. **This is the default unless`-D`or`-O`are present.** > The `-D` flag is the shortcut for: `--save-dev`. Source: https://www.npmjs.org/doc/misc/npm-config.html # 加速安裝 由于`https://www.npmjs.com`在國內訪問不穩定，因此建議使用國內鏡向站點。 具體方法如下： ```shell npm config set registry https://registry.npm.taobao.org # 通過 config 命令設置 registry npm install xxx -g --registry=https://registry.npm.taobao.org # 通過命令行指定安裝 ``` ## `--loglevel verbose` **Append the`--loglevel verbose`argument to the command you want to run**and all logs will be shown on STDERR and saved to`npm-debug.log`file in the current working directory. Example usage:`npm install ionic --loglevel verbose`. Running the`npm`commands like this, shows the logs in realtime and saves the logs to the directory its running within. * * * For permanent solution, just edit the global`npm`configuration. To do this, run`npm config edit`command and add`loglevel=verbose`. Now every`npm`command will show detailed logs > [npm install - How to see logs from npm installation? - Stack Overflow](https://stackoverflow.com/questions/39412424/how-to-see-logs-from-npm-installation) ## nrm/cgr [nrm](https://github.com/Pana/nrm) 是 NPM registry 管理工具，或者 cgr 可以自己切換國內鏡像同步站點。 ```shell nrm use taobao nrm ls ``` > [聊聊 NPM 鏡像那些險象環生的坑](https://mp.weixin.qq.com/s/2ntKGIkR3Uiy9cQfITg2NQ) ## `~/.npmrc`文件 在該文件中加入： ```shell disturl=https://npm.taobao.org/mirrors/node/ phantomjs_cdnurl=http://cnpmjs.org/downloads sass_binary_site=https://npm.taobao.org/mirrors/node-sass/ registry=https://registry.npm.taobao.org ``` 或者通過以下命令執行： ```shell #?設置依賴安裝過程中內部模塊下載Node的淘寶鏡像 npm?config?set?disturl?https://npm.taobao.org/mirrors/node/ #?設置常用模塊的淘寶鏡像 npm config set sass_binary_site https://npm.taobao.org/mirrors/node-sass/ npm config set sharp_dist_base_url https://npm.taobao.org/mirrors/sharp-libvips/ npm config set electron_mirror https://npm.taobao.org/mirrors/electron/ npm config set puppeteer_download_host https://npm.taobao.org/mirrors/ npm config set phantomjs_cdnurl https://npm.taobao.org/mirrors/phantomjs/ npm config set sentrycli_cdnurl https://npm.taobao.org/mirrors/sentry-cli/ npm config set sqlite3_binary_site https://npm.taobao.org/mirrors/sqlite3/ npm config set python_mirror https://npm.taobao.org/mirrors/python/ ``` 有了這波操作，再執行`npm i`安裝以上模塊時就能享受國內的速度了，如果有條件，建議把這些鏡像文件搬到自己或公司的服務器上，將`鏡像地址`指向自己的服務器即可。 # npm 基本命令 ```shell npm -v # 查看npm版本號 npm init -y # 創建 package.json文件 npm root -g # 查看全局包位置 npm ls/list -g --depth=0 # 快速列出全局安裝的頂層模塊，去除整個依賴樹的打印信息 npm info/view patch-package # info <==>view，查看 patch-package 包在遠程 npm 服務器的信息 npm info/view patch-package versions # 查看遠程版本信息 npm update patch-package # 更新本地項目的 patch-package # config 管理 npm 配置文件 npm config set [-g|--global] npm config get npm config delete npm config list [-l] [--json] npm config edit npm get npm set [-g|--global] npm cache clean 清理緩存 ``` > [讓人傾倒的 11 個 npm trick ](http://www.zcfy.cc/article/1206) > [npm 常用命令詳解](https://www.cnblogs.com/PeunZhang/p/5553574.html) ## 本地包安裝 本地安裝，直接本地路徑 ``` npm i ./@ngapp/core --save ``` `package.json` 文件下內容： ``` "@ngapp/core": "file:@ngapp/core", ``` [NPM包的離線安裝](https://www.zcfy.cc/article/offline-installation-of-npm-packages-924.html) # `npx` npm@5.2.0 后新增的命令，引入這個命令的目的是為了提升開發者使用包內提供的命令行工具的體驗。 當我們執行 `npx parcel index.html` 時，自動先去當前項目下`./node_modules/.bin`目錄下找，找不到，再會去 PATH 里找，最后會去臨時安裝。 `npx` 還允許我們單次執行命令而不需要安裝，例如 ```shell npx create-react-app my-cool-new-app ``` npx 甚至支持運行遠程倉庫的可執行文件，如 ```shell npx github:piuccio/cowsay hello ``` 再比如 npx http-server 可以一句話幫你開啟一個靜態服務器！ ```shell npx http-server ``` npx 將`create-react-app`下載到一個臨時目錄，使用以后再刪除。下次再執行，還是會重新臨時安裝。 [yarn dlx](https://next.yarnpkg.com/cli/dlx) 功能和 [npx](https://hub.fastgit.org/npm/npx%23readme) 類似。dlx是`download and execute`的簡稱，這個命令會在本地創建一個臨時的環境來下載指定的依賴，依賴下載完成后，它會在當前的工作目錄（cwd）中執行這個依賴包含的可執行二進制文件，這個臨時的空間會在命令完成后被刪除，所以這些操作都是一次性的。 > [npx 使用教程](http://www.ruanyifeng.com/blog/2019/02/npx.html) > [awesome-npx](https://github.com/suarasaur/awesome-npx) ## 更新項目依賴 在項目根目錄運行 ~~~ npx npm-check -u ~~~ > [如何更新全局安裝的包](npmjs.cn/getting-started/updating-global-packages/) # `npm init｜create ` npm@6 開始，可以 `init` 命令轉換為相應的 `npx` 操作，如下所示： ``` npm init react-app-> npx create-react-app npm init @usr/foo -> npx @usr/create-foo npm init @usr -> npx @usr/create ``` 任何其他選項都將直接傳遞給命令，因此`npm init foo --hello`將映射到 `npx create-foo --hello`。 類似 `yarn create` > [npm-init](https://docs.npmjs.com/cli/init.html) 使用 [npm-check](https://github.com/dylang/npm-check) 有選擇性的去升級 # npm包的CDN [jsDelivr - A free, fast, and reliable CDN for open source](https://www.jsdelivr.com/) [unpkg](https://unpkg.com/)/[npmcdn](https://www.npmcdn.com/) 是一個快速的、全球性的內容分發網絡，為 npm 的所有內容提供服務。 [wzrd](https://wzrd.in/) browserify-as-a-service [Pika CDN](https://www.pika.dev/cdn) # npm `@`作用域 scope 就像是模塊的命名空間，當模板名稱以 `@` 字符開頭，則表示為作用域包 ``` @scope/project-name ``` 每個 npm 用戶都有一個以自己用戶名為作用域 [使用 npm 作用域管理發布包](http://huang-x-h.github.io/2016/06/09/using-npm-scoped-package/) # 控制應用程序版本 與手動更改應用程序的版本相比，npm 提供了一些有用的快捷方式來完成這一點。 要增加版本，請在運行 `npm version 加上` major`，`minor `或` patch`： ~~~ // 1.0.0 npm version patch // 1.0.1 npm version minor // 1.1.0 npm version major // 2.0.0 ~~~ 根據更新應用程序的頻率，可以通過在每次部署時增加版本號來節省時間，使用以下腳本: ~~~ { "predeploy": "npm version patch" } ~~~ # [node命令行工具之實現項目工程自動初始化的標準流程](https://www.cnblogs.com/walls/p/11337718.html) # 參考 [前端工程化（5）：你所需要的 npm 知識儲備都在這了](https://juejin.im/post/5d08d3d3f265da1b7e103a4d#heading-41) https://docs.npmjs.com/cli/install [為什么我從 npm 到 yarn 再到 npm?](https://segmentfault.com/a/1190000014716713)