1.如何全局安装一个 node 应用?
node install -g packagename
2.package.json 有什么作用?
配合npm使用
1. 配置模块包的基本信息
name,version,decription,entry point,test command
git repository,keywords, author,license
2. 模块包的依赖管理
dependencies
devDependencies
3. 定义模块包的使用方式
script
4. 定义模块包的可执行文件地址
bin
5. 定义主程序入口
main
3.npm install --save app 与 npm install --save-dev app有什么区别?
npm install --save app在package.json中创建
"dependencies ": {
"app": "xxx",
}
发布之后,项目运行仍依赖这个模块,会被用户下载。npm install --save-dev app在package.json中创建
"devDependencies": {
"app": "xxx",
}
开发时依赖于这个模块,项目正常运行时不需要这个模块,不会被用户所下载。
4.node_modules的查找路径是怎样的?
require模块时,先在当前目录查找node_modules下的模块,如果没有,再往上一级目录中查询node_modules下的模块,层层递进,直到系统根目录。
5.npm3与 npm2相比有什么改进?
- npm3和npm2在安装模块的时候,策略上前者优于后者。
- npm2是纯粹的不共享包原则。
- npm3的优化点在于对于以字母顺序安装npm包的时候,优先安装在node_modules第一层级目录。
- 这样做的好处是如果后续包有相关依赖性则不需要重复安装。
6.webpack是什么?和其他同类型工具比有什么优势?
webpack 是一个现代 JavaScript 应用程序的模块打包器(module bundler)。当 webpack 处理应用程序时,它会递归地构建一个依赖关系图(dependency graph),其中包含应用程序需要的每个模块,然后将所有这些模块打包成少量的 bundle - 通常只有一个,由浏览器加载。
它是高度可配置的,四个核心概念:入口(entry)、输出(output)、loader、插件(plugins)。
优点:
快速运行,Webpack 使用异步 I/O 和多级缓存提高运行效率
功能丰富的插件系统。大多数内容功能都是基于这个插件系统运行的
Webpack 有一个智能解析器,几乎可以处理任何第三方库,无论它们的模块形式是 CommonJS、 AMD 还是普通的 JS 文件
Webpack 本身只能处理原生的 JavaScript 模块,但是 loader 转换器可以将各种类型的资源转换成 JavaScript 模块。这样,任何资源都可以成为 Webpack 可以处理的模块。
7.npm script是什么?如何使用?
npm scripts容许你在package.json文件的scripts字段定义脚本命令,通过终端使用。
需要注意的是,系统自带的关键字,运行时可以写npm XXX
,其他自定义的需要写成npm run XXX
。
9.gulp是什么?使用 gulp 实现图片压缩、CSS 压缩合并、JS 压缩合并
它是前端自动化构建工作流的利器,可以使用多个插件实现代码打包、压缩、合并、检测、浏览器自动刷新等功能。
var gulp = require('gulp')
var cssnano = require('gulp-cssnano') //压缩css
var uglify = require('gulp-uglify') //压缩js
var concat = require('gulp-concat') //文件合并
var imagemin = require('gulp-imagemin') //图片压缩
gulp.task('css', function(){ //task定义一个任务,执行:gulp css
gulp.src('./src/css/*.css') //获取该路径下的所有css文件
.pipe(concat('index-merge.css')) //3个文件合并成一份
.pipe(cssnano()) //压缩数据流
.pipe(gulp.dest('./dist/css/')) //放置文件
})
gulp.task('js', function(){
gulp.src('./src/js/*.js')
.pipe(concat('index-merge.js'))
.pipe(uglify())
.pipe(gulp.dest('./dist/js/'))
})
gulp.task('imgs', function(){
gulp.src('./src/imgs/*.jpg')
.pipe(imagemin())
.pipe(gulp.dest('./dist/imgs/'))
})
gulp.task('default', ['css','js','imgs'])