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

npm install -g name

2.package.json有什么用

每個(gè)項(xiàng)目的根目錄下，都有一個(gè)package.json文件，記錄了這個(gè)項(xiàng)目所需要的各種模塊，以及項(xiàng)目的配置信息（名稱、版本、許可證等元數(shù)據(jù)）。npm install命令根據(jù)這個(gè)配置文件，自動(dòng)下載所需的模塊，也就是配置項(xiàng)目所需的運(yùn)行和開(kāi)發(fā)環(huán)境。
詳細(xì)資料

3.npm install --save app 與npm install --save-dev app的區(qū)別

npm install --save 會(huì)將該app模塊寫(xiě)入package.json中的dependencies中，表示此包的運(yùn)行的依賴。
npm install --save-dev  會(huì)將該app模塊寫(xiě)入package.json中的devDependencies中，表示開(kāi)發(fā)的依賴，一般是測(cè)試所用模塊

比人在使用你的npm包時(shí)，會(huì)下載dependencies也就是運(yùn)行所需依賴，而devDependencies中的不會(huì)下載。

4.node_module的查找路徑是怎樣的？

node_module首先在當(dāng)前目錄下查找，在當(dāng)前目錄下面沒(méi)有找到node_module的話就想上一級(jí)查找，直至根目錄。

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

webpack是一個(gè)模塊加載器和打包工具，它可以將許多松散的模塊按照依賴和規(guī)則打包成符合生產(chǎn)環(huán)境部署的前端資源。還可以將按需加載的模塊進(jìn)行代碼分隔，等到實(shí)際需要的時(shí)候再異步加載。通過(guò) loader 的轉(zhuǎn)換，任何形式的資源都可以視作模塊，比如 CommonJs 模塊、 AMD 模塊、 ES6 模塊、CSS、圖片、 JSON、Coffeescript、 LESS 等。

優(yōu)勢(shì)：

1. 對(duì)CommonJS、AMD、ES6的語(yǔ)法兼容
2. 對(duì)js、css、圖片等資源文件都支持打包
3. 有獨(dú)立的配置文件webpack.config.js
4. 可以將代碼切割成不同的chunk，實(shí)現(xiàn)按需加載，降低了初始化時(shí)間
5. 具有強(qiáng)大的Plugin接口，大多是內(nèi)部插件，使用起來(lái)比較靈活
6. 串聯(lián)式模塊加載器以及插件機(jī)制，讓其具有更好的靈活性和擴(kuò)展性，例如提供對(duì)CoffeeScript、ES6的支持

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

npm 允許在package.json文件里面，使用scripts字段定義腳本命令。

{
  // ...
  "scripts": {
    "build": "node build.js"
  }
}

這是package.json文件中的一段片段，里面的scripts字段是一個(gè)對(duì)象，它的每一個(gè)屬性，對(duì)應(yīng)一段腳本。比如，build命令對(duì)應(yīng)的腳本是node build.js

$ npm run build 等同于執(zhí)行  $node build.js

7.webpack實(shí)例

效果→

8.gulp是什么？使用gulp實(shí)現(xiàn)圖片壓縮，css壓縮合并，js壓縮合并

gulp是前端開(kāi)發(fā)過(guò)程中對(duì)代碼進(jìn)行構(gòu)建的工具，是自動(dòng)化項(xiàng)目的構(gòu)建利器；它不僅能對(duì)網(wǎng)站資源進(jìn)行優(yōu)化，而且在開(kāi)發(fā)過(guò)程中很多重復(fù)的任務(wù)能夠使用正確的工具自動(dòng)完成；使用它，我們不僅可以很愉快的編寫(xiě)代碼，而且大大提高我們的工作效率。

gulp是基于Nodejs的自動(dòng)任務(wù)運(yùn)行器，能自動(dòng)化地完成javascript/coffee/sass/less/html/image/css 等文件的的測(cè)試、檢查、合并、壓縮、格式化、瀏覽器自動(dòng)刷新、部署文件生成，并監(jiān)聽(tīng)文件在改動(dòng)后重復(fù)指定的這些步驟。在實(shí)現(xiàn)上，它借鑒了Unix操作系統(tǒng)的管道（pipe）思想，前一級(jí)的輸出，直接變成后一級(jí)的輸入，使得在操作上非常簡(jiǎn)單。

//安裝插件
npm install gulp-imagemin --save-dev //圖片壓縮
npm install gulp-cssnano --save-dev //css壓縮
npm install uglify --save-dev //js壓縮
npm install gulp-jshint --save-dev //js規(guī)范檢查
npm install gulp-concat --save-dev //文件合并
npm install gulp-rename --save-dev //重命名

//gulpfile.js
//引入插件
var gulp = require('gulp'),
cssnano = require('gulp-cssnano'),
concat = require('gulp-concat'),
jshint = require('gulp-jshint'),
uglify = require('gulp-uglify'),
imagemin = require('gulp-imagemin'),
rename = require('gulp-rename');

//css合并壓縮
gulp.task('css', function () {
gulp.src('./src/css/*.css')
  .pipe(concat('merge.css')) //將文件合并
  .pipe(rename({
   suffix: '.min' //文件名后加上 .min 
  }))
  .pipe(cssnano()) //css壓縮
  .pipe(gulp.dest('dist/css/')); //輸出
})

//js合并壓縮
gulp.task('js', function () {
gulp.src('src/js/*.js')
  .pipe(jshint()) //js規(guī)范檢查
  .pipe(jshint.reporter('default'))
  .pipe(concat('merge.js'))
  .pipe(rename({
   suffix: '.min'
  }))
  .pipe(uglify())
  .pipe(gulp.dest('dist/js/'));
})

//圖片壓縮
gulp.task('image', function () {
gulp.src('src/imgs/*')
  .pipe(imagemin())
  .pipe(gulp.dest('dist/imgs/'));
})

gulp.task('build', ['css', 'js', 'image'])