vue中npm包全局安裝和局部安裝過(guò)程
全局安裝是將npm包安裝在你的node安裝目錄下的node_modules文件夾中。在windows和mac中,全局安裝的默認(rèn)路徑是不同的。在mac中默認(rèn)是安裝到 /usr/locla/lib 中。在windows默認(rèn)安裝目錄是 C:\Program Files\nodejs ,當(dāng)然你也可以通過(guò)一下命令來(lái)查看全局安裝路徑。
// 查看全局安裝路徑 npm root -g // 查看npm的基礎(chǔ)設(shè)置 npm config ls // 查看安裝目錄路徑 npm config get prefix
全局命令
npm包在全局安裝之后,這個(gè)包的命令就會(huì)被注冊(cè)到全局,你就可以直接在命令行中執(zhí)行這個(gè)命令了。其實(shí)當(dāng)你全局安裝一個(gè)npm包之后,這個(gè)包被存放在 /usr/locla/lib/node_modules 或者 C:\Program Files\nodejs\node_modules 目錄下。而在這個(gè)包的 package.json 文件中,在 bin 屬性下配置的執(zhí)行命令,會(huì)放在 /usr/locla/bin 或者 C:\Program Files\nodejs 文件中。當(dāng)你在命令行執(zhí)行這個(gè)命令,系統(tǒng)就會(huì)執(zhí)行 /usr/locla/bin 目錄下對(duì)應(yīng)的文件。
安裝過(guò)程
以全局安裝vue-cli為例,為大家簡(jiǎn)述一下安裝過(guò)程。
npm install -g @vue/cli 安裝vue包到 /usr/locla/lib/node_modules 。

查找node_modules目錄下的vue包的package.json中的bin屬性。

在目錄 /usr/locla/bin 或者 C:\Program Files\nodejs 查看vue命令的執(zhí)行文件

在命令行中執(zhí)行 vue create vue-test

本地安裝
安裝位置
在特定項(xiàng)目中執(zhí)行 npm install xxx ,那么這個(gè)包會(huì)被安裝在這個(gè)項(xiàng)目的 node_moduels 目錄下。但是如果你在這個(gè)項(xiàng)目中直接執(zhí)行包中的命令,就會(huì)發(fā)現(xiàn)控制臺(tái)報(bào)錯(cuò),告訴你這個(gè)命令找不到。這時(shí)候有兩個(gè)解決方法:
npx 包命令
"scripts": { "包命令": "包命令",}
原理: 在本地安裝一個(gè)包之后,這個(gè)包的命令會(huì)被添加到項(xiàng)目的 node_modules/.bin 文件中。執(zhí)行 npm run 命令 ,package.json中的scripts會(huì)按照一定順序?qū)ふ覍?duì)應(yīng)命令的位置,本地的 node_modules/.bin 也在尋找的清單中。所以本地安裝的包的命令可以執(zhí)行。
總結(jié)
以上所述是小編給大家介紹的vue中npm包全局安裝和局部安裝過(guò)程,希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
如果你覺(jué)得本文對(duì)你有幫助,歡迎轉(zhuǎn)載,煩請(qǐng)注明出處,謝謝!
- vue中Npm run build 根據(jù)環(huán)境傳遞參數(shù)方法來(lái)打包不同域名
- vue打包npm run build時(shí)候界面報(bào)錯(cuò)的解決
- 詳解如何制作并發(fā)布一個(gè)vue的組件的npm包
- 自定義Vue組件打包、發(fā)布到npm及使用教程
- 基于vue如何發(fā)布一個(gè)npm包的方法步驟
- Vue.js構(gòu)建你的第一個(gè)包并在NPM上發(fā)布的方法步驟
- 如何構(gòu)建一個(gè)Vue插件并生成npm包
- vue組件打包并發(fā)布到npm的全過(guò)程
- vue使用npm發(fā)布自己的公網(wǎng)包
相關(guān)文章
javascript實(shí)現(xiàn)瀑布流自適應(yīng)遇到的問(wèn)題及解決方案
這篇文章主要介紹了javascript實(shí)現(xiàn)瀑布流自適應(yīng)遇到的問(wèn)題及解決方案,需要的朋友可以參考下2015-01-01
用Javascript做flash做的事..才完成的一個(gè)類.Auntion Action var 0.1
用Javascript做flash做的事..才完成的一個(gè)類.Auntion Action var 0.1...2007-02-02
js實(shí)現(xiàn)感應(yīng)鼠標(biāo)圖片透明度變化的方法
這篇文章主要介紹了js實(shí)現(xiàn)感應(yīng)鼠標(biāo)圖片透明度變化的方法,涉及javascript鼠標(biāo)操作及css修改技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-02-02
javascript實(shí)現(xiàn)Email郵件顯示與刪除功能
這篇文章主要介紹了javascript實(shí)現(xiàn)Email郵件顯示與刪除功能,需要的朋友可以參考下2015-11-11
微信小程序?qū)崿F(xiàn)頁(yè)面跳轉(zhuǎn)傳值以及獲取值的方法分析
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)頁(yè)面跳轉(zhuǎn)傳值以及獲取值的方法,結(jié)合實(shí)例形式總結(jié)分析了微信小程序頁(yè)面跳轉(zhuǎn)及傳值的常用操作技巧,需要的朋友可以參考下2017-12-12
ECMAScript6函數(shù)剩余參數(shù)(Rest Parameters)
這篇文章主要介紹了ECMAScript6函數(shù)剩余參數(shù)(Rest Parameters)的相關(guān)資料,需要的朋友可以參考下2015-06-06
定時(shí)器(setTimeout/setInterval)調(diào)用帶參函數(shù)失效解決方法
setInterval()方法可按照指定的周期(以毫秒計(jì))來(lái)調(diào)用函數(shù)或計(jì)算表達(dá)式,setTimeout()方法用于在指定的毫秒數(shù)后調(diào)用函數(shù)或計(jì)算表達(dá)式,詳細(xì)使用方法可以參考下本文2013-03-03
javascript如何使用函數(shù)random來(lái)實(shí)現(xiàn)課堂隨機(jī)點(diǎn)名方法詳解
這篇文章主要介紹了javascript如何使用函數(shù)random來(lái)實(shí)現(xiàn)課堂隨機(jī)點(diǎn)名方法詳解,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-07-07

