最近，我將之前用 Cocos Creator 2.x 寫的一個微信小遊戲《球球要回家》移植到了 Cocos Creator 3.6.2 上。
程式語言也從 JavaScript 遷移到了 TypeScript，併成功上線微信小遊戲。
不過在升級過程中，也踩到不少坑。
一是如何將 JS 程式碼高效地翻譯成 TS 程式碼。
另外是，我在使用 Creator 3.6.2 自帶的 2.x 專案升級工具存在 BUG，差點讓我放棄升級。
不過還好，遇到的問題透過 Cocos 論壇、文件都能解決，在此做個記錄，希望對你也有所幫助。
1. 升級專案到 2.4.x 引擎版本
因為 Creator 3.x 已經不在支援 JavaScript 語言，而且 2.4.x 最新版本的 API 介面與 3.x相近。
所以，我的策略是首將程式碼移植到 2.4.x TypeScript 上。
這一步，主要是解決一些廢棄 API 的問題。
在 2.4.10 上，廢棄 API 它不會報錯，但會以警告的方式提示你。
據瞭解 95% 的 2.4.x 以下的專案，升 2.4.5+ 是可以平滑升級的。
2. JS轉TS指令碼
這一步是個體力活，一是對將 JS 指令碼翻譯為 TS 指令碼，二是將新的 TS 指令碼重新掛載節點。
我的做法是，比如：看到有個指令碼為：GameScene.js，先在它旁邊生成一個 GameSceneTS.ts 照著 JS 程式碼邏輯，按 TS 語法重寫一遍程式碼。
雖然這是個體力活，但是在 VSCode 中寫 TS 程式碼還是很享受的，智慧提示非常的方便。
3. 升級專案引擎到 3.6.x
重點來了，這一步需要使用 Creator 3.x 提供的升級工具來升級專案。
使用升級工具，我們可以不必重新去編輯遊戲場景和預製體，重新去掛載指令碼，能省去不少時間。
新建一個 Creator 3.x 工程，從編輯器主選單上 檔案→匯入 Cocos Creator 2.x 專案，看下圖：
瀏覽需要升級的 2.x 工程目錄，會彈出下面這樣一個皮膚：
注意：這裡有一個坑點！我最初在匯入球球要回家 2.4.10 工程後發現，場景中的 Button 按鈕點不動。
為了排除是因為指令碼引起的問題，我使用 2.4.10 重新建了一個 Hello World 工程，新增上 Button 按鈕，再匯入 3.6.2 依然有這個問題，
試了多次無解，我再停下來看匯入皮膚上的說明，開啟一個 Github 倉庫，是這個 2.x 匯入工具的外掛最新版本。
看 README 中的更新說明，正好解決了按鈕不能點選的問題，以及其他 BUG 的修復。
果斷下載外掛安裝上，再次嘗試使用 Hellow World 工程匯入 3.x 引擎 Button 點選問題解決！
4. 升級 3.x 指令碼程式碼
UI 完美再現......OK
元件指令碼節點繫結在......OK
元件屬性、節點引用、元件方法呼叫一切 OK！
但是，這時點選遊戲中的按鈕是沒有反應的，看程式碼如下：
從上圖可以看到，升級工具將所有程式碼函式體全部註釋起來了，現在要做的就是將所有函式體一個個地放開。
在 2.x 時使用的 cc.xxx 這種寫法不能再用了，必須在指令碼頂部做匯入模組匯入：
//從 cc 模組中解構出 Node、Sprite 變數
import { Node, Sprite } from 'cc'
在使用 VSCode 編寫程式碼時，並不需要我們手動一個個敲 import 引入的模組，編輯器會自動新增，看下面：
小結
從 Creator 2.x 移植 3.x 的整體過程，主要為下面四步：
- 升級專案到 2.4.10 或最新版；
- 移植指令碼到 TypeScript；
- 在 Creator 3.x 中使用 2.x 專案匯入工具（注意使用github上的最新版本）；
- 修改 3.x 專案中不相容 2.x 的相關介面程式碼。
後續我還會有更多 Creator 2.x 升級 3.x 的經驗分享，如果本文對你有用，感謝點贊留言！
更多精彩請關注Creator星球遊戲開發社群