主題
- VSCode配置
- 編寫js腳本時智能提示
- JavaScript函數(shù)command點擊不跳轉(zhuǎn)蜈缤,代碼提示不全面
特別說明
CocosCreator微信小游戲開發(fā)系列文章,是我在逐步開發(fā)過程中冯挎,基于官方文檔之上底哥,記錄一些重點內(nèi)容,以及對官方文檔中有些知識點的補(bǔ)充和分析织堂。
正文
1. 代碼編輯器 VS Code
CocosCreator官方推薦的代碼編輯器是Visual Studio Code叠艳,配置編輯環(huán)境有兩步:
- 選擇主菜單里的 開發(fā)者 -> VS Code 工作流 -> 安裝 VS Code 擴(kuò)展插件
- 選擇主菜單的 開發(fā)者 -> VS Code 工作流 -> 更新 VS Code 智能提示數(shù)據(jù)
官方提醒:在項目根目錄中添加 jsconfig.json 設(shè)置文件才能正確的使用包括智能提示在內(nèi)的JavaScript 語言功能,如JavaScript代碼的智能提示失效,請嘗試刪除tsconfig.json文件
2.VSCode配置
- 搜索“VS Code快捷鍵”設(shè)置喜歡的快捷鍵易阳,提高開發(fā)效率附较;
- 修改js腳本并cmd+s保存后,CocosCreator會自動同步腳本meta文件潦俺,運行即可看到更改內(nèi)容拒课;
3. js腳本
Cocos Creator的腳本負(fù)責(zé)控制組件的動態(tài)加載和刷新等業(yè)務(wù)邏輯徐勃,在CocosCreator界面編輯器內(nèi)可以直接創(chuàng)建js或ts腳本,但是具體的編寫還是要用專業(yè)的代碼編輯器的早像,它能大大加快開發(fā)效率僻肖。
首先完整的看完官方文檔“腳本開發(fā)指南”,如果對JavaScript語法不熟悉卢鹦,還要去找JavaScript文檔充電學(xué)習(xí)臀脏。
js腳本編寫過程中需要注意this上下文。比如匿名函數(shù)A作為參數(shù)傳入另一個函數(shù)B時冀自,函數(shù)A的this上下文是變了的揉稚,這時調(diào)用this.C()就會報錯了,解決方法如下:
cc.resources.load("", function (err, spriteFrame) {
...
this.logoSpriteFrame = spriteFrame;
}.bind(this)
);
//或者
var that = this;
cc.resources.load("", function (err, spriteFrame) {
...
that.logoSpriteFrame = spriteFrame;
}
);
4. JavaScript函數(shù)command點擊不跳轉(zhuǎn)熬粗,代碼提示不全面
開發(fā)過程中會發(fā)現(xiàn)creator.d.ts配合jsconfig.json提供的智能提示功能搀玖,真的太弱雞了,很多基礎(chǔ)語法都沒有提示驻呐;
而且當(dāng)想查看函數(shù)引用灌诅,以及點擊跳轉(zhuǎn)函數(shù)都不起作用,內(nèi)心還是很崩潰的含末。
我在網(wǎng)上搜索到一款VS Code插件針對Cocos Creator的JavaScript智能提示和點擊跳轉(zhuǎn)做了優(yōu)化擴(kuò)展猜拾,在VS Code側(cè)邊欄拓展插件中搜索“Cocos Creator JS”
結(jié)尾
自己動手寫,分解項目中的各個模塊需求佣盒,通過查文檔和搜索Cocos社區(qū)关带,解決碰到的問題,最終在微信上線了下面這款微信小游戲《成語錦衣衛(wèi)》沼撕,歡迎大家掃碼體驗,并作為參考項目模版芜飘,開發(fā)出屬于自己的小游戲
預(yù)告
下一節(jié)和朋友們說一說:腳本中節(jié)點如何初始化务豺,通過編輯器掛載,還是cc.find()嗦明?