1. 如何全局安装一个 node 应用?
//packageName是包名
//install 可以用 i 代替
//-g 表示全局安装
npm install -g packageName
2. package.json 有什么作用?
命令行 npm init 可以初始化生成一个package.json
package.json 是一个 json 格式的文件,用来记录当前的 npm 包的相关信息,如:
- name:包的名字
- version:版本号
- description:描述
- main:包的入口文件
- script: 运行脚本命令的npm命令行缩写
- author: 作者
- license: 版权信息
- dependencies:项目运行依赖,正式版本中也需要。
- devDependencies:开发依赖,只有开发时候用的依赖包,正式版本中不需要。
例子:
{
"name": "packageName",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "xxx",
"license": "ISC",
"dependencies": {},
"devDependencies": {}
}
3.npm install --save app 与 npm install --save-dev app有什么区别?
npm install --save app
项目运行依赖:安装名为 app 的包,并在 package.json 中添加到 dependencies 项目运行依赖中去,发布以后别人会自动下载 app 依赖
npm install --save-dev app
开发依赖:安装名为 app 的包,并在 package.json 中添加到 devDependencies 开发依赖中去,这个 app 包依赖只有开发者自己使用,发布后别人用不到
4.nodule_modules 的查找路径是怎样的?
从文件所在目录下的 nodule_modules 开始,逐级向上查找,直到找到根目录,如果还找不到,就会报错。
查找路径伪代码
/e/饥人谷/senior/s5/webpack2-tutorial/node_modules
/e/饥人谷/senior/s5/node_modules
/e/饥人谷/senior/node_modules
/e/饥人谷/node_modules
/e/node_modules
/node_modules
5. npm3与 npm2相比有什么改进?yarn和 npm 相比有什么优势?
-
npm2 把每个依赖的包放在自己的子目录里
优点:目录结构清楚
缺点:可能会有重复冗余的依赖包:如下面示意里 a1 ,重复下载了。|- a //包
|- |- a1 //依赖
|- |- a2 //依赖
|
|- b //包
|- |- a1 //依赖
|- |- b2 //依赖 -
npm3 把每个依赖的包放同级目录下,这样就可以减少包的重复下载
|— a //包
|- a1 //依赖
|- a2 //依赖
|— b //包
|- b2 //依赖 -
yarn和npm比较
npm安装不够快,不够稳定;npm安装时运行代码,存在安全问题。
yarn使用yarn.lock(每当有模块被安装都一定会更新)来保证,不同机子安装程序时的版本一致。
yarn安装速度比npm快。
6. webpack是什么?和其他同类型工具比有什么优势?
WebPack是模块打包工具:它可以分析你的项目结构,找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言(Scss,TypeScript等),并将其编译转换,给供浏览器使用。找到css, 图片, 字体等资源,进行压缩,混淆等操作后,输出为处理后的资源,并实现依赖加载等操作
Grunt和Gulp的工作方式:
image.png可以在一个配置文件中配置对某些文件进行类似编译,组合,压缩等任务的具体步骤,然后使用grunt或gulp自动替你完成这些任务
Webpack的工作方式:
image.png把你的项目当做一个整体,通过一个给定的主文件(如:index.js),Webpack将从这个文件开始找到你的项目的所有依赖文件,通过各种loaders处理后,最后打包为一个浏览器可识别的JavaScript文件。
对比:
webpack 是以commonJS的形式来书写脚本,对 AMD/CMD 的支持也很全面,方便其它模块也兼容使用
扩展性强,插件机制完善,能被模块化处理的资源多,例JS/CSS/IMG等
开发便捷,能替代部分 grunt/gulp 的工作,比如打包、压缩混淆、图片转base64等。
7. npm script是什么?如何使用?
npm 允许在package.json文件里面,使用scripts字段定义脚本命令。
上面代码是package.json文件的一个片段,里面的scripts字段是一个对象。它的每一个属性,对应一段脚本。比如,build命令对应的脚本是node build.js。命令行下使用npm run命令,就可以执行这段脚本。
例子:
// package.json
{
// ...
"scripts": {
"upload": "git add .; git commit -m \"modify\"; git push"
}
}
// commond window
npm run upload
8. 使用 webpack 替换 入门-任务15中模块化使用的 requriejs
9. gulp是什么?使用 gulp 实现图片压缩、CSS 压缩合并、JS 压缩合并
Gulp是前端自动化工具,能够优化前端工作流程。比如自动刷新页面、combo、压缩css、js、编译less等等。简单来说,就是使用Gulp,然后配置你需要的插件,就可以把以前需要手工做的事情让它帮你做了。
网友评论