合成大西瓜（西瓜雨版）及改版思路（保姆式教程）
最近一款名爲”合成大西瓜“的小遊戲突然火了，上了幾次微博熱搜，身邊有些人還在感慨：瓜都喫不完了，還叫我合成瓜～
自己玩了也覺得很有意思，水果掉落，啪嗒一聲，兩個變一個，輕鬆上手又解壓。玩法簡單，通過移動大小不一的球，使其下落與大小統一的球發生碰撞合成更大的球。這個遊戲打開也沒有廣告（好評）。
但是，無論怎麼玩，分數都在3位數4位數徘徊，而且要合成大西瓜又不是特別簡單，覺得不能滿足於此，作爲一名程序員，總是想着透過表面看源碼，於是去網上搜集資料，魔改一番，於是有了這個改版的遊戲“合成大西瓜（西瓜雨版）”，給自己來場西瓜盛宴！（๑乛v乛๑嘿嘿）。
改版後在線玩鏈接：http://dxgcd8b107-6gdxik88d74dfc78-1304937467.tcloudbaseapp.com/
改版後效果圖：
改版的步驟：
- 下載源代碼
- 開發
- 部署上線
（1）下載源碼後在本地環境先嚐試運行，看開發環境有沒有問題
1）需要先安裝 Node 和 npm：
可以通過 “http://nodejs.cn/download/” 官網安裝 Node.js，會自動安裝 npm，安裝後用命令行輸入 npm -v，如果有版本號出現，就說明安裝成功（舒服～）
C:\Users\w1396>npm -v
6.14.8
2）安裝 serve 服務：
在命令行輸入npm i -g serve 安裝（ -g 代表 global ，全局安裝 ）
C:\Users\w1396>npm i -g serve
（如果用 npm 命令下載很慢的話，可以修改成淘寶的鏡像，用 cnpm 命令安裝）
安裝後通過命令 serve -v 查看安裝是否成功：
C:\Users\w1396>serve -v
11.3.2
3）進入源碼目錄（有 index.html的目錄），進入命令行模式，執行 serve命令運行項目
根據命令行窗口提示，在瀏覽器輸入localhost:5000 即可訪問。
（2）開發（魔改）
這個小遊戲是基於cocos2d 遊戲引擎開發的，在改版時，主要關注這幾個文件：
-
index.html：整個項目的主頁面
-
project.js：項目核心代碼，遊戲邏輯都在這裏
-
settings.js：項目配置文件
-
res 目錄：存放圖片和音頻等資源
注：
如果只是修改圖片，直接將自己的圖片改成和源碼的資源文件（目錄：
/res/raw-assets/）的圖片相同尺寸、相同名稱、相同後綴即可。各種水果對應的目錄如下：
- 葡萄：ad
- 櫻桃：0c
- 橘子：d0
- 檸檬：74
- 獼猴桃：13
- 西紅柿：03
- 桃：66
- 菠蘿：84
- 椰子：5f
- 西瓜：56
- 大西瓜：50
- 右上角廣告圖：8c、47
音頻文件目錄：
- 勝利音頻文件：a7
（3）部署
有多種方式，最簡單的我覺得是用“騰訊雲靜態網站託管”，因爲服務器在國內，所以訪問的速度比較快，而且頁面操作都是中文，對開發者也比較友好。
訪問以下鏈接進入 騰訊雲靜態網站託管平臺：https://cloud.tencent.com/product/wh
只要新建一個雲開發環境，然後安裝cloudbase命令行工具，使用命令：
npm install -g @cloudbase/cli
然後執行登錄命令：
cloudbase login
彈出頁面點擊授權，既可完成。
完成後可以看到自己的雲環境id，複製它，待會需要用到。
用同樣的方式進入到源碼目錄的命令行窗口：
執行以下命令將項目發佈上線：
cloudbase hosting:deploy . -e <你的雲環境id>
文件上傳成功後會得到一個訪問鏈接，訪問即可開玩！！！
（4）文末彩蛋
”不會吧不會吧，
不會還有人沒合成出西瓜出來吧？“
如果這篇文章有幫到你，請 點個贊、點個關注 鼓勵支持一下，互相交流學習，一起進步，感謝您的閱讀～
注：
本次修改創意及源碼來源爲 “ 公衆號：’程序員魚皮‘ ”
感謝提供這麼好的創意思路，附上他的源碼地址：https://github.com/liyupi/daxigua
感謝分享！