現(xiàn)在我們嘗試做一個(gè)插件。我們將用到skpm——一個(gè)用于創(chuàng)建姥闪,構(gòu)建和發(fā)布插件的管理器始苇。
安裝
直接用npm來(lái)安裝,命令行輸入
npm install -g skpm
(注意:Node.js需要>V6.x)
開始寫一個(gè)插件
構(gòu)建
命令行輸入
skpm create my-plugin
我們可以得到這樣一個(gè)目錄
可以看到sketch插件的manifest.json和js腳本放在src目錄下筐喳。assets可以放圖片等資源文件催式。
運(yùn)行命令
npm run build
將在目錄下構(gòu)建插件。
若想時(shí)刻觀察變化可運(yùn)行
npm run watch
如果想每次構(gòu)建都運(yùn)行一遍插件避归,可輸入
npm run start
assets
我們可能需要放一些圖片或HTML等資源文件荣月,可以在放在assets文件夾里,這樣在構(gòu)建插件的時(shí)候梳毙,會(huì)一并打包進(jìn)去哺窄。
而最后生成插件的目錄是這樣的:
assets里的資源文件將放在Resources里,因此在編寫時(shí)要以路徑"../Resources/xx"來(lái)引入資源账锹。
查看log
官方提到有3種方法可以查看log萌业。
1.使用 sketch-dev-tools(https://github.com/skpm/sketch-dev-tools)。這個(gè)是一個(gè)sketch插件牌废,然而它會(huì)監(jiān)聽用戶的所有操作咽白,所以十分耗費(fèi)性能。我在使用時(shí)候經(jīng)常閃退鸟缕,所以暫時(shí)不推薦
2.用mac 自帶的Console.app,輸入你的插件名稱排抬,可以篩選出對(duì)應(yīng)的log懂从。
3.打開~/Library/Logs/com.bohemiancoding.sketch3/Plugin Output.log
這個(gè)文件,可以查看到完整的log蹲蒲。
調(diào)試
defaults write ~/Library/Preferences/com.bohemiancoding.sketch3.plist AlwaysReloadScript -bool YES
發(fā)布插件
打開 GitHub → Setting → Developer settings , 在 Personal access tokens 中生成一個(gè) token , 需要有操作 repo 權(quán)限, 使用 skpm 進(jìn)行登錄 (只需一次).
skpm login <github-token>
發(fā)布版本
skpm publish <new-version>
發(fā)布命令會(huì)執(zhí)行下操作:
修改 package.json 版本號(hào)
git tag 當(dāng)前版本
把 plugin.sketchplugin 文件壓縮上傳至 github releases 中
更新 .appcast.xml 文件, 通知 sketch 更新此插件