最近合成大西瓜非常火,很多編程愛(ài)好者將大西瓜改成了各種版本,非常魔性,哈哈。
如果你也想魔改大西瓜,或者想研究一下項(xiàng)目怎么玩的,下面的教程從下載到游戲項(xiàng)目部署一條龍搞定。
步驟一:下載大西瓜源代碼
貼心的我已經(jīng)將各種版本的代碼整理到百度網(wǎng)盤(pán)了,大家可以按需下載:
百度網(wǎng)盤(pán)下載鏈接:
注意:因某些限制,下載鏈接通過(guò)如下方式獲取:
需要的小伙伴,請(qǐng)關(guān)注微信公眾號(hào): Java技術(shù)迷, 或者掃描下方公眾號(hào)二維碼,回復(fù)關(guān)鍵字:0218, 即可免費(fèi)無(wú)套路獲取。

步驟二:嘗試運(yùn)行大西瓜游戲項(xiàng)目
下載的源碼結(jié)構(gòu)如下圖

如果你雙擊打開(kāi) index.html 文件可能卡在98%或者99%不動(dòng):

按 F12打開(kāi) chrome 瀏覽器的開(kāi)發(fā)者調(diào)試模式發(fā)現(xiàn),有大量的報(bào)錯(cuò):

這是因?yàn)楸镜卮蜷_(kāi)是文件是靜態(tài)的,是 file 協(xié)議,并不是 http。所以我們需要在本地跑一個(gè) WEB 服務(wù)器。
步驟三:安裝 nodejs
如果本地沒(méi)有安裝 nodejs 工具,先裝一下 nodejs,主要是要通過(guò) npm 安裝 serve
nodejs 下載地址:http://nodejs.cn/download/

不同的系統(tǒng)選擇不一樣的包。
安裝完成打開(kāi)終端命令行工具,執(zhí)行 npm -v 命令:
如果返回版本號(hào)表示安裝成功。
6.14.10
步驟四:安裝 serve 工具
注意是 serve 不是 server 哦,別打錯(cuò)了。
npm i -g serve --registry=https://registry.npm.taobao.org
返回版本號(hào)表示安裝成功
+ serve@11.3.2
updated 41 packages in 3.083s
步驟五:運(yùn)行本地大西瓜游戲項(xiàng)目
通過(guò)終端命令行cd 進(jìn)入到上面下載的游戲源碼中,直接執(zhí)行 serve 命令就可以啟動(dòng)服務(wù)了,如下圖所示:

上面圖中有兩個(gè)地址,第一個(gè)是可以在電腦瀏覽器本地訪問(wèn)的,第二是可以通過(guò)手機(jī)瀏覽器遠(yuǎn)程訪問(wèn)的,你可以拿手機(jī)試試哈。
溫馨提醒:由于游戲主要適配的手機(jī)端,如果你要通過(guò)電腦瀏覽器玩,需要切到手機(jī)屏幕模式。
打開(kāi) chrome 瀏覽器,F(xiàn)12打開(kāi)控制臺(tái),我把控制臺(tái)放右邊了,默認(rèn)是在下邊。

步驟六:部署大西瓜游戲項(xiàng)目到遠(yuǎn)程服務(wù)器
在本地運(yùn)行會(huì)有一個(gè)限制,關(guān)了電腦手機(jī)就不能玩了,那女朋友豈不是要生氣啦
有沒(méi)有辦法將游戲部署到遠(yuǎn)程服務(wù)器呢?當(dāng)然有啦。
是不是很貴啊?我下面會(huì)介紹一個(gè)免費(fèi)的方式,超級(jí)好用。
主角就是 vercel ,可能很多人沒(méi)有聽(tīng)說(shuō)話,沒(méi)關(guān)系,簡(jiǎn)單來(lái)說(shuō)這個(gè)系統(tǒng)提供了靜態(tài)網(wǎng)站項(xiàng)目的托管服務(wù),有付費(fèi)也有免費(fèi)的,我們使用免費(fèi)的就足夠了。
1. 注冊(cè) vercel 賬號(hào)
先登錄 Github 官網(wǎng):
https://github.com
這里有個(gè)坑需要規(guī)避一下,如果你的 Github 賬號(hào)是綁定的 QQ 郵箱,建議你換成其他郵箱,Vercel 不支持 QQ 郵箱,這個(gè)比較坑
然后打開(kāi)另外一個(gè)頁(yè)面開(kāi)始注冊(cè) vercel 賬號(hào)
https://vercel.com/ 建議直接使用 Github 賬號(hào)登錄。

注冊(cè)完了之后就可以進(jìn)行下一步了。
2. 安裝 vercel 命令行工具
我們需要將項(xiàng)目部署到 vercel 系統(tǒng),通過(guò)使用命令行工具比較方便。
在命令行終端中執(zhí)行命令:
npm install -g vercel --registry=https://registry.npm.taobao.org
返回 vercel 版本號(hào)就表示安裝成功了。
3. 開(kāi)始部署到 vercel 系統(tǒng)
cd 到源碼根目錄然后執(zhí)行: vercel --prod
第一次需要驗(yàn)證郵件,如下圖:

驗(yàn)證完之后可以繼續(xù)執(zhí)行 vercel --prod

如果圖所示項(xiàng)目就發(fā)布成功了,遠(yuǎn)程訪問(wèn)地址是: https://daxigua01.vercel.app/
這個(gè)地址是我發(fā)布的地址,大家可以點(diǎn)擊試玩, 這個(gè)地址是可以分享給其他朋友一起玩, 手機(jī)瀏覽器打開(kāi)效果更加哦。
注意:vercel 的地址已經(jīng)被微信屏蔽了,大家可以將生成的地址拷貝到手機(jī)瀏覽器中運(yùn)行。

到此這篇關(guān)于合成大西瓜開(kāi)發(fā)源碼手把手教你運(yùn)行和部署大西瓜游戲項(xiàng)目(附源碼)的文章就介紹到這了,更多相關(guān)合成大西瓜開(kāi)發(fā)源碼內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!