npm-npmscript-gulp-webpack

1. 如何全局安装一个 node 应用?

npm install -g 

2. package.json 有什么作用？

每个项目的根目录下面，一般都有一个 package.json 文件，定义了这个项目所需要的各种模块，以及项目的配置信息（比如名称、版本、许可证等元数据）。npm install 命令根据这个配置文件，自动下载所需的模块，也就是配置项目所需的运行和开发环境。

npm install -y //快速创建

{
  "name": "test",  //名称
  "version": "0.0.1",  //版本
  "description": "This is my first node.js program.",  //描述
  "main": "index.js",  //入口
  "keywords": [  //关键字
                       "node.js",
                       "javascript"
  ],
  "scripts": {  //执行命令行
      "start": "node index.js"
  },
  "author": "Mike",  //作者
  "license":"MIT",  //认证
  "dependencies": {  //生产环境依赖
                  "express": "latest"
  },
  "devDependencies": {  //开发环境依赖
           "bower": "~1.2.8",
           "grunt": "~0.4.1"
  }
}

3. npm install --save app 与 npm install --save-dev app有什么区别?

--save 将产品运行时（或生产环境）需要的依赖模块添加到 package.json 的 dependencies 中，
在发布后还需要继续使用，否则就运行不了。
--save-dev 将产品的开发环境需要的依赖模块添加到 package.json 的 devDependencies 中，
只在开发时才用到，发布后用不到它。

4. node_modules的查找路径是怎样的?

从当前文件目录开始查找node_modules目录；然后依次进入父目录，查找父目录下的node_modules目录；依次迭代，直到根目录下的node_modules目录。比如某个模块的绝对路径是/home/user/foo.js，在该模块中使用require('bar')方式加载模块时，node将在下面的位置进行搜索：

/home/user/node_modules/bar

/home/node_modules/bar

/node_modules/bar

5. npm3与 npm2相比有什么改进？

npm2
下图是npm2的包依赖的目录构成形式，很容易发现一个问题，如果一个链式依赖非常深，目录相应也会越来越深，查找会越来越慢。而且当我们的不同modules对相同的包进行依赖时，会出现重复，而且很有可能它们的版本不一样(二次开发）但他们的层级是一样的。

npm3

再看看npm3的扁平式目录结构策略：将所有的依赖优先放置第一级目录(即/node-modules/下）。

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/

当遇到版本不同时，npm3会将更高版本者放入依赖它的Module之下，层级关系映射版本关系，有种渐进增强的感觉，低版本作为基础依赖，版本递进则深入一层目录。而其他的不存在版本递进的Module一律放入第一层目录，大大减少了查找时间，提高效率。

yarn和 npm 相比有什么优势?

yarn是facebook为自己的sandbox形式的开发环境创造的包管理器。
相比npm优势如下：
既然是sandbox，摒弃外部环境时，对于离线形式的包安装的支持就很重要，这也是它的最大特点：对所有已经安装过的包进行cache缓存，下次安装这些包时直接从缓存里拉取，对比与npm对网络环境的依赖，yarn解决了这个痛点。

相对于npm的队列式安装（当一个包安装完毕后才会执行下一个），yarn支持Parallel Installation，速度更快。

clean：yarn支持清理命令，可以清理node-modules目录下的包文件，比如一些捆绑进入的广告以及不必要的文件。

网络恢复：一个单独的请求并不会导致整个安装失败，这些请求可以重试直到请求恢复正常。

yarn.lock: 这是一个版本锁，它记录了所有包的版本信息，也就是说，它保证了在任何一台设备上，你对于包的拉取安装都是严格遵循这个版本信息，从而保证不出现：But it works on my computer这样烦人的问题。

6. webpack是什么？和其他同类型工具比有什么优势？

webpack是一款模块加载器兼打包工具，它能把各种资源JS/CSS/图片等都作为模块来使用和处理。优势如下：

webpack 是以 commonJS 的形式来书写脚本，但对 AMD/CMD 的支持也很全面，方便旧项目进行代码迁移。
webpack可以将代码拆分成多个区块，每个区块包含一个或多个模块，它们可以按需异步加载，极大地减少了页面初次加载时间。
webpack 本身只能处理原生的 JS 模块，但是 loader 转换器可以将各种类型的资源转换成 JS 模块。这样，任何资源都可以成为 webpack 可以处理的模块。
webpack 有一个智能解析器，几乎可以处理任何第三方库，无论它们的模块形式是 CommonJS、 AMD 还是普通的 JS 文件。
webpack 还有一个功能丰富的插件系统。大多数内容功能都是基于这个插件系统运行的，还可以开发和使用开源的 webpack 插件，来满足各式各样的需求。
webpack使用异步 I/O 和多级缓存提高运行效率，使得它能够快速增量编译。

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

package.json 文件有一个 scripts 字段，可以用于指定脚本命令，供 npm 直接调用。npm 内置了两个简写的命令：npm test 和 npm start，其它命令要写成 npm run xxx 形式。

8. 使用 webpack 替换 入门-任务15中模块化使用的 requriejs

预览

9. gulp是什么？使用 gulp 实现图片压缩、CSS 压缩合并、JS 压缩合并

gulp.js是一种基于流的，代码优于配置的新一代构建工具。
Gulp和Grunt类似。但相比于Grunt的频繁的IO操作，Gulp的流操作，能更快地完成构建。

//安装插件
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规范检查
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('build:css', function() {
      gulp.src('./src/css/*.css')
        .pipe(concat('merge.css'))
        .pipe(rename({
            suffix: '.min'
        }))
        .pipe(cssnano())
        .pipe(gulp.dest('dist/css/'));
  })