<aside> 💡 本系列教學主要帶你一步步了解RMMZ腳本框架,建議有基本JS基礎再進行閱讀

</aside>

入口index.html

首先我們打開index.html,這個命名通常也是H5遊戲的入口部分。

可以看到body中載入了main.js 的腳本

<body style="background-color: black">
        <script type="text/javascript" src="js/main.js"></script>
</body>

<aside> 💡 簡單來說,rpgmaker的所有程式運作載入,都是靠main.js 進行載入跟運作

</aside>

跟著html 我們可以打開main.js 來看看他在做什麼

實際載入內容的Main.js

在程式碼的最前面定義了 scriptUrls ,這個是用來設定在遊戲開始前要載入的腳本,也包含了要先載入的lib

const scriptUrls = [
    "js/libs/pixi.js",
    "js/libs/pako.min.js",
    "js/libs/localforage.min.js",
    "js/libs/effekseer.min.js",
    "js/libs/vorbisdecoder.js",
    "js/rmmz_core.js",
    "js/rmmz_managers.js",
    "js/rmmz_objects.js",
    "js/rmmz_scenes.js",
    "js/rmmz_sprites.js",
    "js/rmmz_windows.js",
    "js/plugins.js"
];

其中最核心的部分,也是rm的繪圖引擎就是pixi.js

繼續往下看,Main這個class 是用來執行載入的流程

class Main {
    ...
}