1.如何全局安装一个 node 应用?
npm install -g <package_name>
2.package.json 有什么作用？
1.定义了模块的配置信息（名称、版本、许可证、依赖等），
2.通过命令npm install根据这个配置文件，下载所需模块配置环境，便于开发者之间的协作
3. npm install --save app 与 npm install --save-dev app有什么区别?
a.npm installl --save app会在package.json中的dependencies中添加运行时依赖，产品发布后仍需要依靠这些工具运行；
当下载一个node包时执行npm install可以安装dependencies下的依赖，而不会安装devDependencies下的依赖
"dependencies" {
"axios": "^0.16.2"
}
b.npm install --save-dev app则会在devDependencies添加开发依赖，这些工具是开发时使用的，如gulp，产品发布后不需要使用这些工具。
"devDependencies": {
"gulp": "^3.9.1"
}
4.node_modules的查找路径是怎样的?
首先是当前文件夹下的node_modules，然后向上一级查找node_modules，一直到根目录为止
5.npm3与 npm2相比有什么改进？yarn和 npm 相比有什么优势?
参考文献
1.Yarn vs npm: 你需要知道的一切
2.玩转npm
3.一文看懂npm、yarn、pnpm之间的区别
4.npm 依赖解决方案
a.npm3与 npm2相比有什么改进？
- npm3将依赖模块扁平化存放，减轻了npm2中过长依赖嵌套的问题
b.Yarn和 npm 相比有什么优势?
- Yarn默认每次安装应用都会创建或更新
yarn.lock文件，以此保证其他机器安装相同版本的依赖 - 默认情况下Yarn的安装速度更快，Yarn并行下载和安装
- Yarn支持离线安装
- Yarn在每个安装包的代码执行前使用校验码验证包的完整性
6. webpack是什么？和其他同类型工具比有什么优势？
webpack 是一个现代 JavaScript 应用程序的模块打包器(module bundler)。当 webpack 处理应用程序时，它会递归地构建一个依赖关系图(dependency graph)，其中包含应用程序需要的每个模块，然后将所有这些模块打包成少量的 bundle - 通常只有一个，由浏览器加载。
- webpack将项目当做一个整体，通过给定的入口文件（如：index.js），找到你的项目的所有依赖文件，使用loaders和plugins来处理它们；（与gulp相比，gulp是对每一种资源单独处理，并没有整体的概念）
- webpack将所有资源都视为模块，所以诸如less,json,jpg等各种资源都可以被处理；
- webpack根据需要将文件切分，避免模块过多导致的请求过多，也避免只请求一次，文件过大导致的加载缓慢问题。（与r.js requirejs）
7. npm-scripts是什么？如何使用？
npm 允许在package.json文件里面，使用scripts字段定义脚本命令。
通过它，可以进行很多快捷操作。
以下为一个package.json中的scripts片段；
如下，命令行执行npm run build相当于执行node index.js
本地安装webpack后，命令行执行npm run webpack相当于执行./node_modules/webpack/bin/webpack.js
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"build":"node index.js",
"webpack": "webpack",
"server": "webpack-dev-server --open"
},
其中test，start等npm固有命令，可以通过npm {name}，其他自定义name通过npm run {name}来执行
8.使用 webpack 替换 入门-任务15中模块化使用的 requriejs
打包前后目录结构
9.gulp是什么？使用 gulp 实现图片压缩、CSS 压缩合并、JS 压缩合并
gulp是一款打造前端自动化工作流的node应用，包括：打包，压缩，合并，git，远程操作等；
//gulpfile.js
var gulp = require('gulp')
var imagemin = require('gulp-imagemin');
var csso = require('gulp-csso');
var concat = require('gulp-concat');
var uglify = require('gulp-uglify');
gulp.task('img',function () { //图片压缩
gulp.src('src/img/**/*')
.pipe(imagemin())
.pipe(gulp.dest('dist/imgs'))
})
gulp.task('css',function () { //css压缩合并
gulp.src('src/css/*.css')
.pipe(csso())
.pipe(concat('merge.css'))
.pipe(gulp.dest('dist/css/'))
})
gulp.task('js',function () { //js压缩合并
gulp.src('src/**/*.js')
.pipe(uglify())
.pipe(concat('merge.js'))
.pipe(gulp.dest('dist/js'))
})
gulp('default',['img','css','js']) //命令行执行gulp即可
网友评论