一文教會(huì)你如何運(yùn)行vue項(xiàng)目
一、運(yùn)行vue項(xiàng)目
1、下載node.js
安裝完成后分別在cmd中執(zhí)行node -v查看是否安裝成功，出現(xiàn)版本號(hào)就安裝成功了
2、安裝 webpack
npm install webpack -g
安裝完成后分別在cmd中執(zhí)行npm -v查看是否安裝成功，出現(xiàn)版本號(hào)就安裝成功了
3、安裝vue-cli腳手架
cnpm install vue-cli -g
安裝完成后查看vue-cli腳手架 版本確定是否安裝成功，出現(xiàn)版本號(hào)就安裝成功了
vue -V
4、使用vue-cli創(chuàng)建項(xiàng)目
首先創(chuàng)建一個(gè)文件夾，cmd 進(jìn)入到該項(xiàng)目里，輸入以下命令
vue create hello-world
注：hello-word是文件夾名字可以改
5、運(yùn)行項(xiàng)目
輸入以下命令來(lái)運(yùn)行項(xiàng)目
cd hello-world
npm run serve
出現(xiàn)以上頁(yè)面，說(shuō)明項(xiàng)目運(yùn)行成功了。
二、運(yùn)行別人的項(xiàng)目
1、刪除package-lock.json文件
package-lock.json記錄了整個(gè)node_moudles文件夾的樹(shù)狀結(jié)構(gòu)，還記錄了模塊的下載地址，但是它是基于項(xiàng)目作者的npm版本庫(kù)生成的，若不刪掉這個(gè)依賴(lài)文件，容易出現(xiàn)npm版本差異導(dǎo)致的報(bào)錯(cuò)。
2、切換項(xiàng)目目錄
然后打開(kāi)cmd，cd到項(xiàng)目目錄，具體操作：先輸入該盤(pán)符，然后再用cd命令切換目錄。
3、清除npm緩存
npm有緩存時(shí)，常常出現(xiàn)安裝依賴(lài)不成功的現(xiàn)象，且一旦出現(xiàn)這個(gè)問(wèn)題，報(bào)錯(cuò)信息很完善，但根據(jù)報(bào)錯(cuò)信息一項(xiàng)一項(xiàng)去解決，卻死活解決不了，還找不出原因。
npm clean cache -f
4、重新安裝依賴(lài)。
npm install
5、最后運(yùn)行項(xiàng)目。
npm run serve
總結(jié)
到此這篇關(guān)于如何運(yùn)行vue項(xiàng)目的文章就介紹到這了,更多相關(guān)vue項(xiàng)目運(yùn)行內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
在本篇文章里小編給大家整理的是關(guān)于Vue代碼整潔之去重的相關(guān)知識(shí)點(diǎn)內(nèi)容，需要的朋友們學(xué)習(xí)下。2019-08-08
provide和inject在Vue 2中已經(jīng)被廣泛應(yīng)用，不是新鮮API，3.0重新認(rèn)識(shí)一下它們兩個(gè)，本文重點(diǎn)給大家介紹vue3中provide和inject的使用，需要的朋友參考下吧2021-07-07
Vue框架可以很方便的引入各種插件,但是也因此會(huì)經(jīng)常遇到種編譯報(bào)錯(cuò),這篇文章主要給大家介紹了關(guān)于vue前端編譯報(bào)錯(cuò)解決的相關(guān)資料,文中通過(guò)圖文介紹的非常詳細(xì),需要的朋友可以參考下2024-03-03
組件是Vue.js的最核心的功能,所謂的組件化就是把頁(yè)面拆分成多個(gè)組件,每個(gè)組件單獨(dú)使用CSS,JS,模板,圖片等資源進(jìn)行開(kāi)發(fā)與維護(hù),然后在制作網(wǎng)頁(yè)的時(shí)候根據(jù)需要調(diào)用相關(guān)的組件,這篇文章主要給大家介紹了關(guān)于vue.js全局組件和局部組件的相關(guān)資料,需要的朋友可以參考下2022-12-12
vue-cli腳手架build目錄下utils.js工具配置文件詳解
這篇文章主要介紹了vue-cli腳手架build目錄下utils.js工具配置文件詳解,小編覺(jué)得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2018-09-09
這篇文章主要介紹了在vue項(xiàng)目中封裝echarts的步驟，幫助大家更好的理解和使用vue，感興趣的朋友可以了解下2020-12-12
vue實(shí)現(xiàn)數(shù)字滾動(dòng)效果
這篇文章主要為大家詳細(xì)介紹了vue實(shí)現(xiàn)數(shù)字滾動(dòng)效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2020-06-06
vue跳轉(zhuǎn)頁(yè)面打開(kāi)新窗口,并攜帶與接收參數(shù)方式
這篇文章主要介紹了vue跳轉(zhuǎn)頁(yè)面打開(kāi)新窗口，并攜帶與接收參數(shù)方式，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教2022-04-04
這篇文章主要介紹了vue在外部方法給下拉框賦值后不顯示label的解決方案,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-10-10
Vue2中實(shí)現(xiàn)雙擊事件的幾種常見(jiàn)方法
這篇文章主要介紹了Vue2中實(shí)現(xiàn)雙擊事件的幾種常見(jiàn)方法,Vue2中處理雙擊事件的方法包括使用@dblclick指令、addEventListener方法和第三方庫(kù),這些方法提供了靈活的解決方案,以滿足不同的需求,需要的朋友可以參考下2024-11-11