1.如何全局安裝一個(gè) node 應(yīng)用?
每個(gè)模塊可以“全局安裝”专执,也可以“本地安裝”奈偏。
“全局安裝”指的是將一個(gè)模塊安裝到系統(tǒng)目錄中坞嘀,各個(gè)項(xiàng)目都可以調(diào)用。一般來(lái)說(shuō)惊来,全局安裝只適用于工具模塊丽涩,比如eslint和gulp。例如:/user/local/bin/目錄下裁蚁。
“本地安裝”指的是將一個(gè)模塊下載到當(dāng)前項(xiàng)目的node_modules子目錄矢渊,然后只有在項(xiàng)目目錄之中检眯,才能調(diào)用這個(gè)模塊。例如:./node-modules/
本地安裝
npm install <package name>
卸載:npm uninstall -g XXX
全局安裝
npm install -g <package name
2.package.json 有什么作用昆淡?
npm init命令生成package.json文件,這個(gè)文件定義了項(xiàng)目所需的各種模板及相關(guān)配置信息(比如名稱(chēng)刽严、版本昂灵、許可證等元數(shù)據(jù))。npm install命令根據(jù)這個(gè)配置文件舞萄,自動(dòng)下載所需的模塊眨补,也就是配置項(xiàng)目所需的運(yùn)行和開(kāi)發(fā)環(huán)境。
{
"name": "cover_md", //項(xiàng)目名稱(chēng)
"version": "1.0.6", //項(xiàng)目版本號(hào)
"description": "一個(gè) markdown 轉(zhuǎn) html 的小工具", //入口文件
"main": "index.js", //指定了加載的入口文件倒脓,require('moduleName')就會(huì)加載這個(gè)文件撑螺。這個(gè)字段的默認(rèn)值是模塊根目錄下面的index.js
"bin": {
// bin參數(shù)是{ 命令名:文件名 }的格式,指定了各個(gè)內(nèi)部命令對(duì)應(yīng)的可執(zhí)行文件的位置崎弃,相當(dāng)于在user/local/bin下創(chuàng)建一個(gè)快捷方式,映射到對(duì)應(yīng)的文件甘晤,執(zhí)行所映射的文件
// 執(zhí)行`convert`命令時(shí),將運(yùn)行對(duì)應(yīng)文件(./bin/server)
// ./bin/convert文件頭部需添加 #!/usr/bin/env node, 表示將以node運(yùn)行這個(gè)文件
"convert": "./bin/convert"
},
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
"start" : "node app.js" //執(zhí)行當(dāng)前目錄下app.js
//一般默認(rèn)一個(gè)test的空文件夾饲做、用作寫(xiě)測(cè)試代碼线婚,`npm test`即可運(yùn)行。
//自定義的命令名需加run才能與運(yùn)行盆均,`npm run make`
},
"keywords": [ //關(guān)鍵字塞弊,是一個(gè)字符串的數(shù)組,也有助于人們?cè)趎pm搜索你的包
"markdown",
"html",
"convert"
],
"author": "wcon", //作者名稱(chēng)
"license": "ISC", //協(xié)議
"repository": {
"type": "git", //該包在github上的代碼托管倉(cāng)庫(kù)地址
"url": "git+https://github.com/wcongratulation/markdow.git"
},
"dependencies": { // 正式使用時(shí)依賴(lài)的包, npm install --save xxx 生成
"my_dep": "^1.0.0"
},
"devDependencies" : { //開(kāi)發(fā)或者測(cè)試時(shí)泪姨,依賴(lài)的包游沿。npm install --save-dev xxx生成
"my_test_framework": "^3.1.0"
}
"bugs": {
"url": "https://github.com/wcongratulation/markdow/issues" //一個(gè)對(duì)象,包含url網(wǎng)址和郵箱肮砾,當(dāng)使用者發(fā)現(xiàn)問(wèn)題時(shí)诀黍,可以通過(guò)這兩種方式提交問(wèn)題
},
"homepage": "https://github.com/wcongratulation/markdow#readme" //主頁(yè),項(xiàng)目主頁(yè)的地址
}
3.npm install --save app 與 npm install --save-dev app有什么區(qū)別?
如果將node_modules文件夾刪掉唇敞,則執(zhí)行npm install默認(rèn)會(huì)安裝dependencies字段和devDependencies字段中的所有模塊蔗草。
這兩條命令都會(huì)下載app到node_modules文件夾下面,不同之處在于:
npm install --save app:模塊名app將被添加到package.json下的dependencies疆柔。
npm install --save-dev app:模塊名app將被添加到package.json下的devDependencies咒精。
此外:dependencies下的模塊,是我們生產(chǎn)環(huán)境中需要的依賴(lài)旷档,devDependencies只用于開(kāi)發(fā)階段完成集成測(cè)試等功能模塊依賴(lài)模叙。因此,執(zhí)行npm install server-mock時(shí)鞋屈,只會(huì)下載它依賴(lài)層級(jí)dependencies下的模塊范咨,而不會(huì)下載devDependencies的模塊故觅,需要手動(dòng)下載。
4.node_modules的查找路徑是怎樣的?
1.如果require的內(nèi)容以./或者../開(kāi)頭的按照正常的查找路徑渠啊。
2.require內(nèi)容不加./或者../查找的js文件输吏。比如需要查找的依賴(lài)包叫“easytpl”,它會(huì)先在當(dāng)前目錄下查找node_module, 看有沒(méi)有easytpl文件夾(即easytpl包),如果有的話(huà)替蛉,會(huì)讀取easytpl文件夾下的package.json,找到里面的main參數(shù),加載main里對(duì)應(yīng)的路徑的文件贯溅。如果當(dāng)前目錄下沒(méi)有node_module,或當(dāng)前目錄下的node_module沒(méi)找到easytpl躲查,便向上級(jí)目錄中查詢(xún)它浅,直到系統(tǒng)根目錄。
3.node全局安裝在系統(tǒng)根目錄下镣煮,所以全局安裝后可在所有目錄下使用姐霍。
如果當(dāng)前文件是'/home/ry/projects/foo.js' 然后require('bar.js'), 那么node將會(huì)按照以下路徑查找
/home/ry/projects/node_modules/bar.js
/home/ry/node_modules/bar.js
/home/node_modules/bar.js
/node_modules/bar.js
5.npm3與 npm2相比有什么改進(jìn)?yarn和 npm 相比有什么優(yōu)勢(shì)? (選做題目)
npm2和npm3有一個(gè)很大的區(qū)別, 就是組織包的結(jié)構(gòu). npm2組織依賴(lài)的包是按照樹(shù)形組織的. npm3將其改進(jìn)為扁平結(jié)構(gòu)典唇。
npm2會(huì)將所依賴(lài)的包存放到當(dāng)前目錄的./node_modules/目錄下. 而被安裝的包又會(huì)依賴(lài)其他的包的話(huà), 則會(huì)存放到該包的./node_modules下. 所以, 當(dāng)依賴(lài)結(jié)構(gòu)很復(fù)雜的時(shí)候, 目錄結(jié)構(gòu)會(huì)非常深. 不管是性能還是操作上, 體驗(yàn)都不怎么好镊折。
而在npm3中, 采用扁平的目錄結(jié)構(gòu), 二級(jí)依賴(lài)會(huì)放到當(dāng)前目錄的node_modules的里, 與一級(jí)包在同一目錄。
例如:
比如蚓聘,有一個(gè)模塊A腌乡,依賴(lài) B。npm3會(huì)將模塊B放置到與A同級(jí)目錄下夜牡,而npm2會(huì)將B放置到A的依賴(lài)模塊目錄下
npm2与纽,一個(gè) App 里模塊 A 和 C 都依賴(lài)B,無(wú)論被依賴(lài)的 B 是否是同一個(gè)版本塘装,都會(huì)生成對(duì)應(yīng)結(jié)構(gòu)急迂。
npm3,npm install 時(shí)會(huì)按照 package.json 里依賴(lài)的順序依次解析蹦肴,遇到新的包就把它放在第一級(jí)目錄僚碎,后面如果遇到一級(jí)目錄已經(jīng)存在的包,會(huì)先判斷版本阴幌,如果版本一樣則忽略勺阐,否則會(huì)按照 npm2 的方式依次掛在依賴(lài)包目錄下
npm3也存在開(kāi)發(fā)環(huán)境和測(cè)試環(huán)境的 node_modules 目錄結(jié)構(gòu)不一樣以及其他的問(wèn)題,因此FaceBook搞了 yarn 用來(lái)替代 npm
- 快速—會(huì)緩存已經(jīng)下載過(guò)的包矛双,避免重復(fù)下載
- 安全 — 下載前會(huì)檢查簽名及包的完整性
yarn 構(gòu)建步驟如下:
- Resolution: 向倉(cāng)庫(kù)請(qǐng)求依賴(lài)關(guān)系
- Fetching: 看看本地緩存了沒(méi)有渊抽,否則把包拉到緩存里
- Linking: 直接全部從緩存里構(gòu)建好目錄樹(shù)放到 node_modules 里
參考 npm2 npm3 yarn 的故事
6.webpack是什么?和其他同類(lèi)型工具比有什么優(yōu)勢(shì)议忽?
WebPack是一個(gè)模塊化加載器兼打包工具懒闷,它同時(shí)支持AMD、CMD等加載規(guī)范。
它能夠打包WebHTML愤估、js帮辟、CSS以及各種靜態(tài)文件(圖片、字體等)玩焰。
對(duì)于不同類(lèi)型的資源由驹,webpack有對(duì)應(yīng)的模塊加載器。
webpack模塊打包器會(huì)分析模塊間的依賴(lài)關(guān)系昔园,最后 生成了優(yōu)化且合并后的靜態(tài)資源荔棉。
優(yōu)勢(shì):
1.代碼分割:按需加載模塊
2.Loaders:通過(guò)加載器我們可以將其他類(lèi)型的資源轉(zhuǎn)換為JS輸出
3.webpack提供了強(qiáng)大的插件系統(tǒng),當(dāng)webpack內(nèi)置的功能不能滿(mǎn)足我們的構(gòu)建需求時(shí)蒿赢,我們可以通過(guò)使用插件來(lái)提高工作效率。因?yàn)樗梢约虞d幾乎所有的第三方庫(kù)
7.npm scripts 是什么渣触?如何使用羡棵?
npm script 是 package.json 中的一個(gè)屬性
可以在這個(gè)屬性中自定義 npm 命令,輸入這個(gè)命令就會(huì)執(zhí)行指定的操作
如:
// 在 package.json 中
{
...
'script': {
'create': 'mkdir app'
}
...
}
// 在命令行中輸入:
$ npm run create
// 就會(huì)運(yùn)行指令 mkdir app, 表示創(chuàng)建一個(gè)文件app