npm-npmscript-gulp-webpack

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

npm   install   -g    XXX
  1. 将安装包放在 /usr/local/lib/node_modules 下
  2. 可以直接在命令行里使用

一。 区分本地安装与 全局安装
本地安装

  1. 将安装包放在 ./node_modules 下(运行npm时所在的目录)
  2. 可以通过 require() 来引入本地安装的包
    本地安装只有在当前项目中可以使用

全局安装

  1. 将安装包放在 /usr/local 下
  2. 可以直接在命令行里使用
    全局安装在所有项目中都可以使用

二. 为什么全局安装后还要本地安装
仅全局安装足够吗
1.在js实例代码中,默认下node.js会在NODE_PATH和目前js所在项目下的node_modules文件夹下去寻找模块,因此,如果只是全局安装,不能直接通过require()的方式去引用模块,需要手动解决包路径的配置问题,当然你也可以复制全局安装的node_modules文件夹到项目下,还有办法可以选择将环境变量的NODE_PATH设置为C:\Program Files\nodejs。
2.对于包的更新不好管理,可能你需要为每个包重新命名,如gulp@3.8.1、gulp@3.9.1...,为了区别不同项目使用指定的包,保证模块之间的相互依赖(这块下面会介绍),区别每个项目正常运行。
因此,不推荐全局安装。
nodejs全局安装和本地安装的区别
题目2: package.json 有什么作用?

每个项目的根目录下面, 一般都有一个package.json 文件, 定义了这个项目所需要的各种模块, 以及项目的配置信息(比如 名称、 版本、 许可证等元数据)。
npm intsall 命令根据这个配置文件, 自动下载所需的模块, 也就是配置项目所需的运行和开发环境。
命令行: npm init -y
name: 项目名称
version: 项目版本
description: 描述内容
main: 主程序入口
srcipts: 命令行工具, 用于执行命令
dependencies: 指定了项目运行所依赖的模块
devDependencies: 项目开发时所需要的依赖模块

题目3: npm install --save app 与 npm install --save-dev app有什么区别?

1.区别在于 一个线上(生产)环境使用 , 一个是在开发环境

--save-dev 开发环境下的工具(比如angular, vue, sass),在开发时用到的, 在线上环境不需要
--save 线上环境下的依赖, 在线上发布时要用到的

  1. 在package.json 中不同位置:
    npm install --save app 写入 package.json 中的 dependencies:{ }
    npm install --save-dev app 写入 package.json 中的DevDependencies中

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

先在当前目录中查找, 没找到, 再依次向上级目录查找, 可以一直往上直到 系统根目录。

题目5: npm3与 npm2相比有什么改进?yarn和 npm 相比有什么优势? (选做题目)
npm2 以嵌套方式安装所有的依赖关系。 npm3 会尝试减轻这种嵌套造成的深层树和冗余
npm3 尝试通过 以平面当时安装一些辅助依赖关系(依赖关系的依赖关系),与需要主依赖关系的目录相同。

yarn和 npm相比有什么优势?
yarn.lock 文件
并行安装
更简洁的输出
CLI 命令区别
稳定性和可依赖度

题目6: webpack是什么?和其他同类型工具比有什么优势?
webpack 是一个模块加载器兼打包工具, 它能把 各种西园, 例如 js(jsx), coffee、 样式(less/sass)、图片 等都作为模块来使用和处理。

Paste_Image.png

1.webpack是commonJS 的形式来书写脚本, 但是对 AMD/CMDde 的支持也很全面, 方便旧项目进行代码迁移。
2.能被模块化的不仅仅是JS,能对css img等文件都能打包。

  1. 开发便捷, 能代替部分grunt/gulp 的工作,比如:打包 压缩 图片转base64等。
  2. 扩展性强, 插件机制完善, 特别死支持React 热插拔的功能让人眼前一亮。

题目7:npm script是什么?如何使用?

npm script 允许在package.json 中使用 scripts字段定义脚本命令。

命令行除了npm start
npm test之外, 其他的都需要 npm run XXX

"scripts":{
       "test":" node text.js",
        "start":"node index.js",
         "bulid":"npm install -g packageName"
}
执行对应的 命令

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

github
题目9:gulp是什么?使用 gulp 实现图片压缩、CSS 压缩合并、JS 压缩合并

gulp 是 打造前端工作流的利器, 可以使用多个插件 实现 代码的打包、压缩 合并 git 远程操作 浏览器自动刷新 等 操作

var gulp = require('gulp')

//引用组件
var cssnano = require('gulp-cssnano'),//css压缩
    uglify= require('gulp-uglify'),// js压缩
    concat= require('gulp-concat'),//合并文件
    clean =require('gulp-clean'),// 清空文件夹
    imagemin= require('gulp-imagemin'),// 图片压缩
    autoprefixer= require('gulp-autorefixer')//css浏览器兼容

//图片压缩
gulp.task('img', function(){
  gulp.src('src/imgs/*')
      .pipe(imagemin())
      .pipe(gulp.dest("dist/imgs"))
});

//css压缩合并兼容
gulp.task('css',function(){
  gulp.src('dist/css/*')
      .pipe(clean())
  
  return gulp.src('src/**/*.css')
         .pipe(cssnano())
         .pipe(conct("merge.css"))
         .pipe(autoprefixer({
             browsers: ['last 2 versions'],
             cascade: false
         }))
         .pipe(gulp(dist/css))
  
});


//js 压缩  合并

gulp.task('js',function(){
  gulp.src('dist/js/*')
      .pipe(clean())
      
  return gulp.src('src/**/*.css')
             .pipe(uglify())
             .pipe(concat("merge.js"))
             .pipe(gulp.dest('dist/js'))
  
  
})

gulp.task('default',['img','css','js'])

命令行: gulp   或 gulp img/css/js 执行单个任务

题目10: 开发一个 node 命令行天气应用用于查询用户当前所在城市的天气,发布到 npm 上去。可以通过如下方式安装使用(可使用api.jirengu.com里提供的查询天气接口) (选做题目)

npm install hunger-weather -g
weather

部分代码
#!/user/bin/env node  
//说明是在node中运行

var axios= require('axios')
console.log(process.argv)

var data={}

if(process.argv[2]){
  data.params={
    city: process.argv[2]
  }
}

axios.get('http://api.jirengu.com/weather.php')
      .then(function (reponse){
            console.log(reponse)
})

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

推荐阅读更多精彩内容