1： 如何全局安裝一個 node 應用?

npm install -g app

2： package.json 有什么作用？

相當于你本地項目的一個文檔說明。
允許你指定你項目中所使用的node包的版本。
構(gòu)建你的項目更加容易，便于給其他人共享。

   {
        "name": "my_package",     //你的項目名稱，全部小寫，不能有空格，一個單詞，允許-和_. 
                                  //如果是要發(fā)布自己的node插件，一般用github上面項目名稱。 

        "version": "1.0.0",  //你的項目版本號，最好遵守 GNU 版本號管理。 

        "main": "index.js", //目錄中啟動文件名稱?；蛘叻Q之為入口文件，一般都是 index.js

        "scripts": {

            "test": "echo \"Error: no test specified\" && exit 1"    
            //一般默認一個test的空文件夾、用作寫測試代碼。

        },

        "keywords": [],  //項目的關(guān)鍵詞。 一般用不到，發(fā)布npm才用得到。

        "author": "ag_dubs", //作者名稱

        "license": "ISC", //協(xié)議 

        "repository": {  // 用來存放到 版本管理遠程服務。 發(fā)布npm才有用

            "type": "git",

            "url": "https://github.com/ashleygwilliams/my_package.git"

        },

        "dependencies": {   // 正式使用時，依賴的包

            "my_dep": "^1.0.0"

        },

        "devDependencies" : {//開發(fā)或者測試時，依賴的包。

            "my_test_framework": "^3.1.0"

        }

        "bugs": {  //同repository

            "url": "https://github.com/ashleygwilliams/my_package/issues"

        },

        "homepage": "https://github.com/ashleygwilliams/my_package"  
        //項目主頁、 發(fā)布才有用

    }

一般情況，如果是自己的項目，特別是前端的人，會使用到gulp或者grunt來打包自己的項目，并且一般不會吧node_modules上傳到git上面，所以需要package來管理自己打包所需的插件，以便于項目中其他人員共享，這個文件的好處就是一個人添加某個插件后，更改了這個文件，其他人員只需要同步此文件，然后執(zhí)行npm install命令，即可安裝同樣的包。

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

--save 會把依賴包名稱添加到 package.json 文件 dependencies 鍵下，--save-dev 則添加到 package.json 文件 devDependencies 鍵下
區(qū)別是，devDependencies 下列出的模塊，是我們開發(fā)時用的；dependencies 下的模塊，則是我們發(fā)布后還需要依賴的模塊，譬如像jQuery庫或者Angular框架類似的，我們在開發(fā)完后后肯定還要依賴它們，否則就運行不了。

4： node_modules的查找路徑是怎樣的?

node_modules的查找路徑：先從本地目錄下尋找，不存在就依次向上級目錄中查詢，直到系統(tǒng)根目錄。node全局安裝在系統(tǒng)根目錄下，所以全局安裝后可在所有目錄下使用

5：npm3 與 npm2相比有什么改進？

這個問題如果在很久以前打開你的node-moudles文件夾一探究竟的同學就會有感覺，當時里面的目錄很清晰，一個packages就是一個目錄，里面再包括自身文件和依賴包。 后來有一天再打開驚呆了，里面一堆目錄，當時覺得這很不neat，很不優(yōu)雅。google的是npm更新到了npm3之后才發(fā)現(xiàn)自己的愚蠢，我們來看一張圖。

Paste_Image.png

現(xiàn)在我們看到的是npm2的包依賴的目錄構(gòu)成形式，很容易發(fā)現(xiàn)一個問題，如果一個鏈式依賴非常深，目錄相應也會越來越深，在我們定義css樣式的時候就接觸到一個概念: 層級查找是很慢的.
html>body>div.container>ul.gallery>li.item>img.image => 慢到爆炸!!！
同樣的遞進目錄查找同樣慢，越深越慢。而且還會存在一個問題，（黃色圈）當我們的不同modules對相同的包進行依賴時，會出現(xiàn)重復，而且很有可能它們的版本不一樣(二次開發(fā)）但他們的層級是一樣的(很不logical).

再看看npm3的扁平式目錄結(jié)構(gòu)策略： 將所有的依賴優(yōu)先放置第一級目錄(即'/node-modules'/下），看圖解釋：

Paste_Image.png

APP依賴Module A
Module A 依賴 Module B ----------------- ./node-modules
Module A 依賴 Module C ----------------- ./node-modules
Module B 依賴 Module D version 1.0 ----- ./node-modules
Module C 依賴 Module D version 2.0 ----- ./node-modules/ModuleC/
很清晰：So，當遇到版本不同時，npm3會將更高版本者放入依賴它的Module之下，層級關(guān)系映射版本關(guān)系，有種漸進增強的感覺，低版本作為基礎依賴，版本遞進則深入一層目錄。 而其他的不存在版本遞進的Module一律放入第一層目錄，大大減少了查找時間，提高效率。

yarn和 npm 相比有什么優(yōu)勢?
yarn是facebook為自己的sandbox形式的開發(fā)環(huán)境創(chuàng)造的包管理器，既然是sandbox，摒棄外部環(huán)境時，對于離線形式的包安裝的支持就很重要，這也是它的最大特點： 對所有已經(jīng)安裝過的包進行cache緩存，下次安裝這些包時直接從緩存里拉取，對比與npm對網(wǎng)絡環(huán)境的依賴，yarn解決了這個痛點。

More advantages over npm:

相對于npm的隊列式安裝（當一個包安裝完畢后才會執(zhí)行下一個），yarn支持Parallel Installation，速度更快。
yarn.lock: 這是一個版本鎖，它記錄了所有包的版本信息，也就是說，它保證了在任何一臺設備上，你對于包的拉取安裝都是嚴格遵循這個版本信息，從而保證不出現(xiàn)： But it works on my computer 這樣煩人的問題。
clean： yarn支持清理命令，可以清理node-modules目錄下的包文件，比如一些捆綁進入的廣告以及不必要的文件。
網(wǎng)絡恢復： 一個單獨的請求并不會導致整個安裝失敗，這些請求可以重試直到請求恢復正常。
不得不說，F(xiàn)家還是很任性的，一言不合就造個輪子給自己用，而且還比市面的大輪子更好.

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

Webpack 是當下最熱門的前端資源模塊化管理和打包工具。它可以將許多松散的模塊按照依賴和規(guī)則打包成符合生產(chǎn)環(huán)境部署的前端資源。還可以將按需加載的模塊進行代碼分隔，等到實際需要的時候再異步加載。通過 loader 的轉(zhuǎn)換，任何形式的資源都可以視作模塊，比如 CommonJs 模塊、 AMD 模塊、 ES6 模塊、CSS、圖片、 JSON、Coffeescript、 LESS 等。
優(yōu)勢:

• 對 CommonJS 、 AMD 、ES6的語法做了兼容
• 對js、css、圖片等資源文件都支持打包
• 串聯(lián)式模塊加載器以及插件機制，讓其具有更好的靈活性和擴展性，例如提供對CoffeeScript、ES6的支持
• 有獨立的配置文件webpack.config.js
• 可以將代碼切割成不同的chunk，實現(xiàn)按需加載，降低了初始化時間
• 支持 SourceUrls 和 SourceMaps，易于調(diào)試
• 具有強大的Plugin接口，大多是內(nèi)部插件，使用起來比較靈活
• webpack 使用異步 IO 并具有多級緩存。這使得 webpack 很快且在增量編譯上更加快

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

npm script 是 package.json 中的一個屬性，可以在這個屬性中自定義npm命令腳本，簡化操作。

"scripts": {
"run": "npm install -g npm",
"webpack":"webpack",
"start":"npm run build"
}
在package.json的scripts內(nèi)添加鍵值對("name":"命令")，之后便可以使用了。
命令可以是命令行命令，npm程序，也可以是scripts內(nèi)自定義的命令。
start和test命令可以不用加run，直接輸入npm start/npm test即可操作，其他自定義命令設置完成，在終端內(nèi)便可以通過npm run name來執(zhí)行。

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

gulp是一個自動化構(gòu)建工具,開發(fā)者可以使用它在項目開發(fā)過程中自動執(zhí)行常見任務使用 gulp 實現(xiàn)圖片壓縮、CSS 壓縮合并、JS 壓縮合并.

var gulp = require('gulp')

var cssnano = require('gulp-cssnano'), //css壓縮
    uglify = require('gulp-uglify'), //js壓縮
    concat = require('gulp-concat'), //合并文件

    rename = require('gulp-rename'), //重命名
    clean = require('gulp-clean'), //清空文件夾

    minhtml = require('gulp-htmlmin'), //html壓縮
    jshint = require('gulp-jshint'), //js代碼規(guī)范檢查
    imagemin = require('gulp-imagemin') //圖片壓縮

gulp.task('html', function() {
    return gulp.src('src/*.html')
        .pipe(minhtml({ collapseWhitespace: true }))
        .pipe(gulp.dest('dist'))
})
gulp.task('css', function() {
    return gulp.src('src/css/*.css')
        .pipe(concat('merge.min.css'))
        .pipe(cssnano())
        .pipe(gulp.dest('dist/css/'))
})

gulp.task('js', function() {
    return gulp.src('src/js/*.js')
        .pipe(jshint())
        .pipe(jshint.reporter('default'))
        .pipe(concat('merge.js'))
        .pipe(rename({
            suffix: '.min' //換個名字
        }))
        .pipe(uglify())
        .pipe(gulp.dest('dist/js/'))
})

gulp.task('img', function() {
    return gulp.src('src/imgs/*')
        .pipe(imagemin())
        .pipe(gulp.dest('dist/imgs/'))
})

gulp.task('clear', function() {
    return gulp.src('dist/*', { read: false })
        .pipe(clean())
})

gulp.task('build', ['html', 'css', 'js', 'img'])
//命令行
gulp build