當(dāng)前位置:首頁 > IT技術(shù) > 微信平臺 > 正文

如何運行g(shù)ithub上的mpvue小程序開源項目
2021-07-28 16:10:18

在安裝好了node和vue腳手架之后,就可以找一個例子來本地運行一下了,如果環(huán)境還沒有安裝好

以mpvue音樂小程序項目源碼/mpvue微信小程序demo 為例
下載地址:https://github.com/XieTongXue/mpvue-music

1:打開鏈接,將項目download到本地


?
如何運行g(shù)ithub上的mpvue小程序開源項目_學(xué)習(xí)
?

2:使用git或者cmd進入項目目錄,安裝依賴,為了避免國外服務(wù)器網(wǎng)速慢,我們使用國內(nèi)淘寶鏡像安裝。

 cnpm install
?
如何運行g(shù)ithub上的mpvue小程序開源項目_學(xué)習(xí)_02
?

3:安裝完成之后,輸入運行命令

npm run dev
?
如何運行g(shù)ithub上的mpvue小程序開源項目_學(xué)習(xí)_03
?

安裝預(yù)覽的時候,不是用瀏覽器打開輸入:localhost:8080。而是打開微信開發(fā)者工具,把項目根目錄導(dǎo)入進去。

4:但是,打開微信開發(fā)者工具的時候,會出現(xiàn)這樣的報錯。

?
如何運行g(shù)ithub上的mpvue小程序開源項目_學(xué)習(xí)_04
?

5:點擊右上角詳情
勾選不校驗合法域名、web-view(業(yè)務(wù)域名)、TLS 版本以及 HTTPS 證書


?
如何運行g(shù)ithub上的mpvue小程序開源項目_學(xué)習(xí)_05
?

6:查看項目如下,這個時候一個項目就可以跑起來了,研究項目結(jié)構(gòu),仔細(xì)查看每個模塊的代碼,慢慢的就可以做一個mpvue小程序了。


?
如何運行g(shù)ithub上的mpvue小程序開源項目_學(xué)習(xí)_06
?

可能會出現(xiàn)的錯誤提示:mpvue踩坑-未找到入口 app.json 文件,或者文件讀取失敗,請檢查后重新編譯。這個時候,解決的方法已經(jīng)替你寫好了,覺得很開的的話那就給本菇?jīng)鲆粋€贊吧

原文作者:祈澈姑娘
90后前端妹子,愛編程,愛運營,愛折騰。
堅持總結(jié)工作中遇到的技術(shù)問題,堅持記錄工作中所思所見,對于博客上面有不會的問題,可以加入qq群聊來問我:473819131.


本文摘自 :https://blog.51cto.com/u

開通會員,享受整站包年服務(wù)立即開通 >