npm 到底是什麼？

無論是寫 react 還是 vue，在最開始我們都會需要一個指令 npm install 如果需要安裝套件，也使用 npm install xxx --save 但是！！npm 到底是什麼？！

以前想要用 jQuery ，都是去它的官網下載 Source 塞到專案裡面的 lib，然後再去 html include 它。但是這樣手動很麻煩呀！所以 npm 就出現了！

nom ( Node Package Manager) 就是一個線上套件庫，可以下載各種Javascript的套件來使用。

npm 要怎麼用？（請先安裝好 npm）

1. 在專案中npm init

過程中會詢問：

• name: 就是該專案的名字，它預設就是該目錄名。
• description: 專案描述。
• entry point: 專案切入點，這有點複雜，之後再說。(index.js)
• test command: 專案測試指令，之後說。
• git repository: 專案原始碼的版本控管位置。
• keywoard: 專案關鍵字
• author: 專案作者，以author-name author@email.com寫之。
• license: 專案版權。
  沒問題的話就按enter，之後會產生 package.json 裡面記錄專案的資訊。

2. 試裝 jQuery 看看會發生什麼神奇的事？

輸入 npm install jQuery —save ，npm 會在他的線上函式庫搜尋有沒有人上傳這個套件，找到之後就會自動抓下來，這時候回到 package.json會發現多出了：

"dependencies": {
    "jQuery": "^1.7.4"
  }

以及一個新資料夾 node_module 裡面就有我們想要的 jQuery。

3. 為什麼要多出一個 node_module 資料夾？

Npm 會在每個專案中安裝他們需要的套件，跟pip不一樣，python套件通常會安裝在 usr/local/bin ，這樣不同專案都可以使用這些套件。 Npm 這樣的做法比較耗資源，但也因為每個專案都次隔離的環境，較不會互相影響。

所以就是這樣，用npm安裝的套件，都會在package.json的dependency裡面註記安裝了甚麼以及版本，然後套件的source code會被塞到node_module裡面管理。
如果要使用的話，就到 html 裡面的script src= 設為node_module/xxx/xxx...就可以了。

<這邊再去補 Browserify 的 require 和 webpack 的 import 我還沒有搞懂 >< >

.gitignore 和 為什麼package.json 需要去記錄裝了什麼套件？

最後要上傳到 github的時候，不要忘記新增一個檔案 .gitignore 然後把 node_module 加進去。
因為node_module隨著專案逐漸龐大，裡面也會越來越多東西，但我們只需要把 package.json上傳，別人看到dependency裡面記錄的資訊，再npm install 就可以自動在本機安裝那些專案需要的套件了，而不需要把那一大包node_module隨身帶著走呦><！

參考資料：從零開始: 使用NPM套件 - 進擊的 Front End‘s - Medium