npm-npmscript-gulp-webpack

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

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

2. package.json 有什么作用？

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

package.json 是一个 json 格式的文件，用来记录当前的 npm 包的相关信息，如：

name：包的名字
version：版本号
description：描述
main：包的入口文件
script：运行脚本命令的npm命令行缩写
author: 作者
license: 版权信息
dependencies：项目运行依赖，正式版本中也需要。
devDependencies：开发依赖，只有开发时候用的依赖包，正式版本中不需要。

例子：

  {
    "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有什么区别?

npm install --save app
项目运行依赖：安装名为 app 的包，并在 package.json 中添加到 dependencies 项目运行依赖中去，发布以后别人会自动下载 app 依赖

npm install --save-dev app
开发依赖：安装名为 app 的包，并在 package.json 中添加到 devDependencies 开发依赖中去，这个 app 包依赖只有开发者自己使用，发布后别人用不到

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相比有什么改进？yarn和 npm 相比有什么优势?

npm2 把每个依赖的包放在自己的子目录里
优点：目录结构清楚
缺点：可能会有重复冗余的依赖包：如下面示意里 a1 ，重复下载了。

|- a //包
|- |- a1 //依赖
|- |- a2 //依赖
|
|- b //包
|- |- a1 //依赖
|- |- b2 //依赖
npm3 把每个依赖的包放同级目录下，这样就可以减少包的重复下载

|— a //包
|- a1 //依赖
|- a2 //依赖
|— b //包
|- b2 //依赖
yarn和npm比较
npm安装不够快，不够稳定；npm安装时运行代码，存在安全问题。
yarn使用yarn.lock(每当有模块被安装都一定会更新)来保证，不同机子安装程序时的版本一致。
yarn安装速度比npm快。

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

WebPack是模块打包工具：它可以分析你的项目结构，找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言（Scss，TypeScript等），并将其编译转换，给供浏览器使用。找到css, 图片，字体等资源，进行压缩，混淆等操作后，输出为处理后的资源，并实现依赖加载等操作

Grunt和Gulp的工作方式：

image.png

可以在一个配置文件中配置对某些文件进行类似编译，组合，压缩等任务的具体步骤，然后使用grunt或gulp自动替你完成这些任务

Webpack的工作方式：

image.png

把你的项目当做一个整体，通过一个给定的主文件（如：index.js），Webpack将从这个文件开始找到你的项目的所有依赖文件，通过各种loaders处理后，最后打包为一个浏览器可识别的JavaScript文件。

对比：
webpack 是以commonJS的形式来书写脚本，对 AMD/CMD 的支持也很全面，方便其它模块也兼容使用
扩展性强，插件机制完善，能被模块化处理的资源多，例JS/CSS/IMG等
开发便捷，能替代部分 grunt/gulp 的工作，比如打包、压缩混淆、图片转base64等。

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

npm 允许在package.json文件里面，使用scripts字段定义脚本命令。
上面代码是package.json文件的一个片段，里面的scripts字段是一个对象。它的每一个属性，对应一段脚本。比如，build命令对应的脚本是node build.js。命令行下使用npm run命令，就可以执行这段脚本。

例子：

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

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

预览
 代码

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

Gulp是前端自动化工具，能够优化前端工作流程。比如自动刷新页面、combo、压缩css、js、编译less等等。简单来说，就是使用Gulp，然后配置你需要的插件，就可以把以前需要手工做的事情让它帮你做了。