1: 如何全局安装一个 node 应用?
全局安装:package会被下载到特定的系统目录下,安装的package能够在所有目录下使用
npm install -g <package>
例如:
npm install -g jshint
优点:无论哪个目录都可以正常使用软件包。如果被墙建议打开科学上网工具,或者先安装npm install -g cnpm --
本地安装: package会被下载当前所在目录,只能在当前目录下使用
npm install <package>
例如:
npm install jshint
缺点:只能在对应安装目录下使用,如果其他目录想使用这个软件包那其他目录也要执行npm install jshint
此命令。
附加部分:查看npm版本输入 npm -v
更新npm输入sudo npm install npm -g
2: package.json 有什么作用?
如果想发一个包,必须要发package.json,该文件夹告诉npm你这个包当前的版本及其他的相关信息,例如包的名字(别人搜索包时候的名字),在每一次重新发布时候版本号必须更新,main指当前入口,便于他人引用入口。
例如:
3: npm install --save app 与 npm install --save-dev app有什么区别?
npm install --save app
自动把模块和版本号添加到dependencies
部分
npm install --save-dev app
自动把模块和版本号添加到devdependencies
部分
devdependencies是开发时依赖,比如你模块用了marked测试框架,那么你的模块的开发就依赖 marked,如果别人想为你的模块贡献代码,他就需要安装marked。但是只是使用你的模块的人,就不需要安装marked。
4: node_modules的查找路径是怎样的?
先再本身文件夹查找是否有node_odules文件夹,找不到再到上一级,找到便停止。找不到便继续往上一级查找直到根目录。
5: npm3与 npm2相比有什么改进?yarn和 npm 相比有什么优势? (选做题目)
npm3与 npm2对比:
npm2安装所有的dependencies都是嵌套的方式,是树形结构。
npm3以平坦的方式安装dependencies,将dependencies安装在同一目录中,解决了npm2带来的冗长浪费空间的安装方式
两者主要的不同是:
不再区分dependencies的主次。
改变了node_modules文件的结构
例:
此时模块A依赖B模块
现某应用依赖模块A。执行
npm install
npm3 将模块A和依赖的模块B平铺放入node_modules文件中
npm2是嵌套的模式放入
假设我们还需要依赖模块C,但是模块C依赖是高版本的B模块
然而B v1.0已经作为顶层依赖,我们无法将B v2.0作为顶层依赖,npm3将会默认npm2的嵌套型结构,不同的是将会把B v2.0模块放在所依赖它的C模块下面
在终端我们会看到如下文件结构
依赖关系列表和它们之间的关系可以使用
npm ls
查看首要依赖可以使用
npm ls --depth=0
yarn优点(来自官网介绍):
1.缓存下载的每个软件包,因此它永远不需要再次下载它。它还将操作并行化以最大限度地利用资源,因此安装时间比以往更快。
2.其代码执行之前使用校验和来验证每个已安装软件包的完整性。
3.使用详细而简洁的lockfile文件和确定性的安装算法,能够保证在一个系统上的安装,也可以在其他系统上以相同工作方式运行。
4.无论安装顺序如何,相同的依赖关系都将以相同的方式安装在每台机器上。
5.如果您之前安装了一个软件包,则可以在没有任何互联网连接的情况下重新安装它。
6.从npm安装任何软件包,并保持软件包工作流程相同。
7.单个请求失败不会导致安装失败。请求在失败时重试。
8.解析不匹配的依赖版本为一个单一的版本来避免导致多个版本。
9.可以高效地队列化请求,使网络利用率最大化
yarn和npm不同点:
1.同一个项目,安装的时候无法保持一致性。由于package.json文件中版本号的特点,下面三个版本号在安装的时候代表不同的含义。
"1.0.3",//安装指定的1.0.3版本
"~1.0.3",//1.0.X中最新版本
"^1.0.3"//安装1.X.X中最新版本
在协同完成项目时由于依赖模块版本的不同会导致bug。
yarn的解决办法
为了保证包版本的错误匹配,精确版本号会被yarn的lock文件记录下来。每次模块的添加,Yarn会创建一个yarn.lock文件。这样就可以保证另一个机器安装的了完全相同的版本的包,并且同时在package.json里仍保存着一个充许的版本段。
在npm里shrinkwrap命令也会产生lock文件,然后npm在读取package.json之前会读取那个文件,跟Yarn读取yarn.lock类似。不同点是Yarn总是会自动的更新yarn.lock文件,而npm需要你自己去手动维护。
yarn.lock 文档
2.npm允许在包安装的时候运行代码,yarn不行
3.npm安装包是顺序执行,yarn可以并行安装
4.npm安装依赖包是树形结构
yarn安装包是这种字段
npm install命令可以从package.json文件里安装依赖,并且允许你添加新的包。
yarn install只能安装在yarn.lock或者packag.json里的列出来的依赖,以它们保存的顺序。
5.yarn add [–dev]
跟 npm install 类似,yarn add 让你添加并且安装一个依赖。如命令名所示,它会添加一个依赖并自动的保存相应的包到package.json,跟npm的--save标记一样。Yarn的--dev标记添加一个开发依赖,就象npm的--save-dev标记一样。
yarn add [package]
npm install [package]
6.yarn upgrade
这个命令将包升级到package.json规则指定的版本范围的最新版,而不是yarn.lock所定义的完全一致的版本。想要在npm达成一致的效果,你需要运行下面的命令:
rm -rf node_modules
npm install
这个命令不要跟npm update混淆了,npm update
会升级所有的包到最新的版本。
yarn upgrade [package]
ps:如果安装包实在很慢时还是使用yarn安装会快一些
6: webpack是什么?和其他同类型工具比有什么优势?
一款模块加载器兼打包工具,有半个前端工作流功能,也是可以将模块打包到一起,能把各种资源JS/CSS/图片等都作为模块来使用和处理。
优势如下:
1.是以 commonJS 的形式来书写脚本,但对 AMD/CMD 的支持也很全面,方便旧项目进行代码迁移。
2.可以将代码拆分成多个区块,每个区块包含一个或多个模块,它们可以按需异步加载,极大地减少了页面初次加载时间。
本身只能处理原生的 JS 模块,但是 loader 转换器可以将各种类型的资源转换成 JS 模块。这样,任何资源都可以成为 webpack 可以处理的模块。
有智能解析器,几乎可以处理任何第三方库,无论它们的模块形式是 CommonJS、 AMD 还是普通的 JS 文件。
有功能丰富的插件系统。大多数内容功能都是基于这个插件系统运行的,还可以开发和使用开源的 webpack 插件,来满足各式各样的需求。
6.使用异步 I/O 和多级缓存提高运行效率,使得它能够快速增量编译。
7:npm script是什么?如何使用?
npm 允许在package.json文件里面,使用scripts字段定义脚本命令。
{
"scripts": {
"build": "node build.js"
}
}
使用npm run
命令可以执行脚本
npm run build
# 等同于执行
node build.js
这些定义在package.json里面的脚本,就称为 npm 脚本。
查看当前项目的所有 npm 脚本命令,可以使用不带任何参数的npm run命令:
npm run
npm默认的脚本值有
"start": "node server.js":
#执行使用npm start
"install": "node-gyp rebuild":
#执行使用npm install
"test": "echo \"文字"
#执行使用npm test
8: 使用 webpack 替换 入门-任务15中模块化使用的 requriejs
该链接建议使用chrome浏览器打开会快一些,接口也可以顺利加载
如果新闻部分未显示建议您点击chrome浏览器右上方的加载不安全脚本按钮
9:gulp是什么?使用 gulp 实现图片压缩、CSS 压缩合并、JS 压缩合并
gulp:
- 是一款nodejs应用
- 打造前端工作流的利器,打包、压缩、合并、git、远程操作...
- 简单易用,通过最少的 API,掌握 Gulp 毫不费力,构建工作尽在掌握:如同一系列流管道。
- 利用 Node.js 流的威力,你可以快速构建项目并减少频繁的 IO 操作。
- 插件质量高
- 通过代码优于配置的策略,Gulp 让简单的任务简单,复杂的任务可管理。
var gulp = require('gulp'),
imagemin = require('gulp-imagemin');
var clean = require('gulp-clean'),
cssnano = require('gulp-cssnano'),
concat = require('gulp-concat'),
autoprefixer = require('gulp-autoprefixer');
var uglify = require('gulp-uglify')
图片压缩
gulp.task('dist:imgs', function(){
gulp.src('src/imgs/*')
.pipe(imagemin())//压缩图片
.pipe(gulp.dest('dist/imgs'))//所有图片输出到dist文件中的imgs文件夹内
})
css压缩合并
gulp.task('dist:css', function(){
gulp.src('dist/css/*').pipe(clean());//dist中css文件清空
return gulp.src('src/**/*.less')//再将src中以less为结尾的文件拷贝过去
.pipe(less())//将less文件转为css
.pipe(cssnano())//压缩css文件
.pipe(concat('merge.css'))//将所有css文件集成一个名为merge.css文件
.pipe(autoprefixer({//自动添加一个前缀,看需求写
browsers:['last 2 versions'],
cascade: false
}))
.pipe(gulp.dest('dist/css'))//merge.css被传入到dist/css文件夹中
})
js压缩合并
gulp.task('dist:js', function(){
gulp.src('dist/js/*').pipe(clean());//dist中js文件清空
return gulp.src('src/**/*.js')//再将src中以js为结尾的文件拷贝过去
.pipe(uglify())//压缩js
.pipe(concat('merge.js'))//将所有jd文件集成一个名为merge.js文件
.pipe(gulp.dest('dist/js'))//merge.js被传入到dist/js文件夹中
})
//git bash简单方法调用
gulp.task('bulid', ['dist:imgs','dist:css','dist:js'])
//在git bash中输入gulp build就可调用以上三个任务
10: 开发一个 node 命令行天气应用用于查询用户当前所在城市的天气,发布到 npm 上去。可以通过如下方式安装使用(可使用api.jirengu.com里提供的查询天气接口) (选做题目)
npm install hunger-weather -g
weather
安装后的效果如下: