1. 如何全局安裝一個 node 應(yīng)用?

//packageName是包名
//install 可以用 i 代替
//-g 表示全局安裝
npm install -g packageName

2. package.json 有什么作用？

命令行 npm init 可以初始化生成一個package.json

package.json 是一個 json 格式的文件，用來記錄當(dāng)前的 npm 包的相關(guān)信息，如：

• name：包的名字
• version：版本號
• description：描述
• main：包的入口文件
• script： 運行腳本命令的npm命令行縮寫
• author: 作者
• license: 版權(quán)信息
• dependencies：項目運行依賴，正式版本中也需要。
• devDependencies：開發(fā)依賴，只有開發(fā)時候用的依賴包，正式版本中不需要。

例子：

  {
    "name": "packageName", 
    "version": "1.0.0",
    "description": "",
    "main": "index.js",
    "scripts": {
      "test": "echo \"Error: no test specified\" && exit 1"
  },
    "author": "xxx",
    "license": "ISC",
    "dependencies": {},
    "devDependencies": {}
  }

3.npm install --save app 與 npm install --save-dev app有什么區(qū)別?

npm install --save app
項目運行依賴：安裝名為 app 的包，并在 package.json 中添加到 dependencies 項目運行依賴中去，發(fā)布以后別人會自動下載 app 依賴

npm install --save-dev app
開發(fā)依賴：安裝名為 app 的包，并在 package.json 中添加到 devDependencies 開發(fā)依賴中去，這個 app 包依賴只有開發(fā)者自己使用，發(fā)布后別人用不到

4.nodule_modules 的查找路徑是怎樣的?

從文件所在目錄下的 nodule_modules 開始，逐級向上查找，直到找到根目錄，如果還找不到，就會報錯。

查找路徑偽代碼

/e/饑人谷/senior/s5/webpack2-tutorial/node_modules
/e/饑人谷/senior/s5/node_modules
/e/饑人谷/senior/node_modules
/e/饑人谷/node_modules
/e/node_modules
/node_modules 

5. npm3與 npm2相比有什么改進(jìn)？yarn和 npm 相比有什么優(yōu)勢?

• npm2 把每個依賴的包放在自己的子目錄里
  優(yōu)點：目錄結(jié)構(gòu)清楚
  缺點：可能會有重復(fù)冗余的依賴包：如下面示意里 a1 ，重復(fù)下載了。

  |- a //包
  |- |- a1 //依賴
  |- |- a2 //依賴
  |
  |- b //包
  |- |- a1 //依賴
  |- |- b2 //依賴

• npm3 把每個依賴的包放同級目錄下，這樣就可以減少包的重復(fù)下載

  |— a //包
  |- a1 //依賴
  |- a2 //依賴
  |— b //包
  |- b2 //依賴

• yarn和npm比較
  npm安裝不夠快，不夠穩(wěn)定；npm安裝時運行代碼，存在安全問題。
  yarn使用yarn.lock(每當(dāng)有模塊被安裝都一定會更新)來保證，不同機子安裝程序時的版本一致。
  yarn安裝速度比npm快。

6. webpack是什么？和其他同類型工具比有什么優(yōu)勢？

WebPack是模塊打包工具：它可以分析你的項目結(jié)構(gòu)，找到JavaScript模塊以及其它的一些瀏覽器不能直接運行的拓展語言（Scss，TypeScript等），并將其編譯轉(zhuǎn)換，給供瀏覽器使用。找到css, 圖片， 字體等資源，進(jìn)行壓縮，混淆等操作后，輸出為處理后的資源，并實現(xiàn)依賴加載等操作

Grunt和Gulp的工作方式：

image.png

可以在一個配置文件中配置對某些文件進(jìn)行類似編譯，組合，壓縮等任務(wù)的具體步驟，然后使用grunt或gulp自動替你完成這些任務(wù)

Webpack的工作方式：

image.png

把你的項目當(dāng)做一個整體，通過一個給定的主文件（如：index.js），Webpack將從這個文件開始找到你的項目的所有依賴文件，通過各種loaders處理后，最后打包為一個瀏覽器可識別的JavaScript文件。

對比：
webpack 是以commonJS的形式來書寫腳本，對 AMD/CMD 的支持也很全面，方便其它模塊也兼容使用
擴(kuò)展性強，插件機制完善，能被模塊化處理的資源多，例JS/CSS/IMG等
開發(fā)便捷，能替代部分 grunt/gulp 的工作，比如打包、壓縮混淆、圖片轉(zhuǎn)base64等。

7. npm script是什么？如何使用？

npm 允許在package.json文件里面，使用scripts字段定義腳本命令。
上面代碼是package.json文件的一個片段，里面的scripts字段是一個對象。它的每一個屬性，對應(yīng)一段腳本。比如，build命令對應(yīng)的腳本是node build.js。命令行下使用npm run命令，就可以執(zhí)行這段腳本。

例子：

// package.json
{
  // ...
  "scripts": {
    "upload": "git add .; git commit -m \"modify\"; git push"
  }
}
// commond window
npm run upload

8. 使用 webpack 替換 入門-任務(wù)15中模塊化使用的 requriejs

預(yù)覽
代碼

9. gulp是什么？使用 gulp 實現(xiàn)圖片壓縮、CSS 壓縮合并、JS 壓縮合并

Gulp是前端自動化工具，能夠優(yōu)化前端工作流程。比如自動刷新頁面、combo、壓縮css、js、編譯less等等。簡單來說，就是使用Gulp，然后配置你需要的插件，就可以把以前需要手工做的事情讓它幫你做了。

預(yù)覽
代碼