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.对于包的更新不好管理，可能你需要为每个包重新命名，如[email protected]、[email protected]...，为了区别不同项目使用指定的包，保证模块之间的相互依赖（这块下面会介绍），区别每个项目正常运行。
因此，不推荐全局安装。
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 线上环境下的依赖， 在线上发布时要用到的

2. 在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等文件都能打包。

3. 开发便捷， 能代替部分grunt/gulp 的工作，比如：打包 压缩 图片转base64等。
4. 扩展性强， 插件机制完善， 特别死支持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)
})