题目1： 如何全局安装一个 node 应用?
npm install -g xxx
//xxx为包名
如果下载速度比较慢，可以使用淘宝的镜像
//先执行下面命令
npm install -g cnpm --registry=https://registry.npm.taobao.org
//以后安装就用 cnpm 代替 npm
cnpm install -g xxx
install可以缩写成i
题目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": "cg",
"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 是一款模块加载器兼打包工具，它能把各种资源 JS、CSS、图片等都作为模块来使用和处理。
优势：
- 用 commonJS 来书写，对 AMD/CMD 支持也很全面，
- 方便其他模块也兼容使用，扩展性强，插件机制完善，能被模块化处理的资源多
- 开发便捷，能替代部分 grunt/gulp 的工作，比如打包，压缩。
题目7： npm script 是什么？如何使用
npm script 是 package.json 里的一个属性，可以自定义命令，用 npm run xxx来执行
（如果 xxx 是 test 、start，则不用加 run，因为这是 npm 内置的命令）
{
"name": "npm-demo",
"version": "1.0.0",
"description": "第一个npm demo",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"mkdir": "mkdir test",
"delete": "rm -r test"
},
"keywords": [
"npm-demo"
],
"author": "cg",
"license": "ISC",
"dependencies": {
"marked": "^0.3.6"
}
}
-
npm test就能输出里面的echo \"Error: no test specified\" && exit 1 -
npm run mkdir创建了test文件夹 -
npm run mkdir删除了test文件夹
题目8： 使用 webpack 替换 入门-任务15中模块化使用的 requriejs
效果
demo
重点
webpack.config.js 配置文件
//webpack.config.js
module.exports = {
entry: './app.js',
output: {
path: __dirname,
filename: 'bundle.js'
}
}
app.js 入口文件
var $ = require("jquery")
var goTop = require("./js/com/gotop")
var carousel = require("./js/com/carousel")
var loadMore = require("./js/com/loadmore")
var lazy = require("./js/com/lazy")
var water = require("./js/com/waterfull")
new goTop($("body"))
carousel.init($(".carousel"))
loadMore.init($("#more"), $(".ct"))
lazy.init($(".ct img"))
$(".ct img").on("load", function(){
water.init($(".ct"))
})