npm-npmscript-gulp-webpack

题目1: 如何全局安装一个 node 应用?

“全局安装”指的是将一个模块安装到系统目录中,各个项目都可以调用。一般来说,全局安装只适用于工具模块,比如eslint和gulp.
“本地安装”指的是将一个模块下载到当前项目的node_modules子目录,然后只有在项目目录之中,才能调用这个模块。

  • 全局安装
    $ npm install -g 应用名称
  • 本地安装
    $ npm install 应用名称
题目2: package.json 有什么作用?

package.json文件:定义了这个项目所需要的各种模块,以及项目的配置信息(比如名称、版本、许可证等元数据)。
npm install命令根据这个配置文件,自动下载所需的模块,也就是配置项目所需的运行和开发环境。
package.json文件可以手工编写,也可以使用npm init命令自动生成。所有问题之中,只有项目名称(name)和项目版本(version)是必填的,其他都是选填的。
有了package.json文件,直接使用npm install命令,就会在当前目录中安装所需要的模块。
下面是一个比较完整的package.json文件。

{
    "name": "Hello World",//项目名称
    "version": "0.0.1",//项目版本
    "author": "张三",
    "description": "第一个node.js程序",
    "keywords":["node.js","javascript"],
    "repository": {
        "type": "git",
        "url": "https://path/to/url"
    },
    "license":"MIT",
    "engines": {"node": "0.10.x"},
    "bugs":{"url":"http://path/to/bug","email":"bug@example.com"},
    "contributors":[{"name":"李四","email":"lisi@example.com"}],
    "scripts": {             //scripts指定了运行脚本命令的npm命令行缩写
        "start": "node index.js"//npm run star
    },
    "dependencies": {  //项目运行所依赖的模块
        "express": "latest"
    },
    "devDependencies": {//项目开发所需要的模块
        "bower": "~1.2.8"
    }
}
题目3: npm install --save app 与 npm install --save-dev app有什么区别?

npm install --save app自动把模块app添加到dependencies部分
npm install --save-dev app 自动把模块app添加到devdependencies部分
dependencies:项目依赖的模块,npm install 会自动下载其中的模块。
devdependencies:开发依赖的模块,主要是配置测试框架,npm install 不会自动下载。

题目4: node_modules的查找路径是怎样的?

require("moduleA")依赖的模块不加./和../以及/的规则是从当前node_modules 文件夹加载,如果找到了就停止,如果没有就查找上层目录的node_modules文件夹,只要找到或者查到根路径为止
比如, 如果当前文件是'/home/ry/projects/foo.js' 然后require('bar.js'), 那么node将会按照以下路径查找
/home/ry/projects/node_modules/bar.js//当前
/home/ry/node_modules/bar.js//上一级
/home/node_modules/bar.js//上一级
/node_modules/bar.js//根路径

题目5: npm3与 npm2相比有什么改进?yarn和 npm 相比有什么优势? (选做题目)

参考npm2 npm3 yarn 的故事

题目6: webpack是什么?和其他同类型工具比有什么优势?

Webpack 是一个模块打包器,它将根据模块的依赖关系进行静态分析,然后将这些模块按照指定的规则生成对应的静态资源。它能把各种资源,例如JS(含JSX)、coffee、样式(含less/sass)、图片等都作为模块来使用和处理。
我们可以直接使用 require(XXX) 的形式来引入各模块,即使它们可能需要经过编译(比如JSX和sass),但我们无须在上面花费太多心思,因为 webpack 有着各种健全的加载器(loader)在默默处理这些事情。
webpack的官网: http://webpack.github.io/ ,文档地址: http://webpack.github.io/docs/

webpack 的优势

  • 代码拆分:Webpack 有两种组织模块依赖的方式,同步和异步。异步依赖作为分割点,形成一个新的块。在优化了依赖树后,每一个异步区块都作为一个文件被打包。
  • Loader:Webpack 本身只能处理原生的 JavaScript 模块,但是 loader 转换器可以将各种类型的资源转换成 JavaScript 模块。这样,任何资源都可以成为 Webpack 可以处理的模块。
  • 智能解析:Webpack 有一个智能解析器,几乎可以处理任何第三方库,无论它们的模块形式是 CommonJS、 AMD 还是普通的 JS 文件。甚至在加载依赖的时候,允许使用动态表达式 require("./templates/" + name + ".jade")。
  • 插件系统:Webpack 还有一个功能丰富的插件系统。大多数内容功能都是基于这个插件系统运行的,还可以开发和使用开源的 Webpack 插件,来满足各式各样的需求。
  • 快速运行:Webpack 使用异步 I/O 和多级缓存提高运行效率,这使得 Webpack 能够以令人难以置信的速度快速增量编译。
题目7:npm script是什么?如何使用?

npm 不仅可以用于 模块管理,还可以用于 执行脚本,npm script是写在package.json文件里面,用scripts字段定义脚本命令。
使用示例
//a
{
// ...
"scripts": {
"build": "node build.js"
}
}
上面代码是package.json文件的一个片段,里面的scripts字段是一个对象。它的每一个属性,对应一段脚本。比如,build命令对应的脚本是node build.js。
命令行下使用npm run命令,就可以执行这段脚本。
$ npm run build
# 等同于执行
$ node build.js
参考npm scripts 使用指南

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

代码地址
效果展示

题目9:gulp是什么?使用 gulp 实现图片压缩、CSS 压缩合并、JS 压缩合并。
  • gulp是什么
    gulp是基于Nodejs的自动任务运行器, 能自动化地完成javascript/coffee/sass/less/html/image/css 等文件的的测试、检查、合并、压缩、格式化、浏览器自动刷新、部署文件生成,并监听文件在改动后重复指定的这些步骤。在实现上,她借鉴了Unix操作系统的管道(pipe)思想,前一级的输出,直接变成后一级的输入,使得在操作上非常简单。
  • 使用 gulp 实现图片压缩、CSS 压缩合并、JS 压缩合并
    步骤(由于基于node,首先需要下载node)
    1.全局安装gulp:
    $ npm install gulp -g
    2.本地安装gulp(在项目所在文件夹内安装):
    $ npm install gulp -D
    注:全局安装gulp是为了执行gulp任务,本地安装gulp则是为了调用gulp插件方便
    a. 依赖模块的路径,gulp所在的node_modules,没有本地安装,需要手动更改;
    b. 不同项目依赖的模块版本
    3.下载需要的gulp插件
    #图片压缩
    $ npm install gulp-imagemin -S;
    #js压缩
    $ npm install gulp-uglify -S;
    #css压缩
    $ npm install gulp-clean-css -S;
    #文件合并
    $ npm install gulp-concat -S;
    4.新建gulpfile.js文件:gulp项目的配置文件,一般位于项目根目录的普通js文件,
    代码如下:
//导入工具包 require('node_modules里对应模块')
var gulp = require('gulp'),
    imagemin = require('gulp-imagemin'),
    uglify = require('gulp-uglify'),
    cleanCSS  = require('gulp-clean-css'),
    concat = require('gulp-concat')
//定义任务
gulp.task('image',function(arument){
  return gulp.src('src/images/*')//需要处理的文件路径
          .pipe(imagemin())
          .pipe(gulp.dest('dist/images'))//操作后存放的路径;此例放在dist/images

});
gulp.task('js',function(arument){
  return gulp.src('src/js/*.js')
          .pipe(uglify())
          .pipe(concat('all.js'))//参数必填,压缩后的js名
          .pipe(gulp.dest('dist/js/'))

});
gulp.task('css',function(arument){
  return gulp.src('src/css/*.css')
          .pipe(cleanCSS({compatibility: 'ie8'}))
          .pipe(concat('all.css'))//参数必填,压缩后的css名
          .pipe(gulp.dest('dist/css/'))

})
gulp.task('build', ['css', 'js', 'image']);
//命令行执行 gulp build ,实现src目录下的css、js合并压缩,图片压缩,最后放入 dist目录下;
题目10: 开发一个 node 命令行天气应用用于查询用户当前所在城市的天气,发布到 npm 上去。可以通过如下方式安装使用(可使用api.jirengu.com里提供的查询天气接口) (选做题目)

npm install hunger-weather -g
weather

代码地址
npm地址

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 162,710评论 4 376
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 68,839评论 2 308
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 112,295评论 0 255
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 44,776评论 0 223
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 53,198评论 3 297
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 41,074评论 1 226
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 32,200评论 2 322
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,986评论 0 214
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,733评论 1 250
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,877评论 2 254
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,348评论 1 265
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,675评论 3 265
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 33,393评论 3 246
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,209评论 0 9
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,996评论 0 201
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 36,212评论 2 287
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 36,003评论 2 280

推荐阅读更多精彩内容