Hvigor允許開發(fā)者實現(xiàn)自己的插件暑始,開發(fā)者可以定義自己的構(gòu)建邏輯胧谈,并與他人共享。Hvigor主要提供了兩種方式來實現(xiàn)插件:基于hvigorfile腳本開發(fā)插件浪藻、基于typescript項目開發(fā)浙芙。下面以基于hvigorfile腳本開發(fā)插件進(jìn)行介紹登刺。
基于hvigorfile腳本開發(fā)
基于hvigorfile.ts腳本開發(fā)的方式,其優(yōu)點(diǎn)是可實現(xiàn)快速開發(fā)嗡呼,直接編輯工程或模塊下hvigorfile.ts即可編寫插件代碼纸俭,不足之處是在多個項目中,無法方便的進(jìn)行插件代碼的復(fù)用和共享分發(fā)南窗。
- 導(dǎo)入模塊依賴揍很。
// 導(dǎo)入接口
import { HvigorPlugin, HvigorNode } from '@ohos/hvigor'
- 編寫插件代碼。
在hvigorfile.ts中定義插件方法万伤,實現(xiàn)HvigorPlugin接口女轿。
// 實現(xiàn)自定義插件
function customPlugin(): HvigorPlugin {
return {
pluginId: 'customPlugin',
apply(node: HvigorNode) {
// 插件主體
console.log('hello customPlugin!');
}
}
}
- 在導(dǎo)出聲明中使用插件。
export default {
system: appTasks,
plugins:[
customPlugin() // 應(yīng)用自定義Plugin
]
}
使用hvigorfile插件動態(tài)生成navigation防混淆文件
我們在使用navigation的系統(tǒng)路由表時壕翩,每次添加新頁面,都需要配置一下release環(huán)境防混淆傅寡。若將這些頁面放在一個固定的目錄下放妈,則與我們的模塊化設(shè)計相違背,若命名使用固定的前綴或后綴荐操,總感覺有點(diǎn)多余芜抒,手動一個一個的添加,雖然符合我們的代碼規(guī)范設(shè)計托启,但就是有點(diǎn)繁瑣宅倒。有沒有更方便的方式來處理這個混淆配置呢?
其實我們可以在寫一個hvigorfilew插件來自動生成混淆配置文件屯耸。我們自定義一個HvigorPlugin任務(wù)拐迁,通過OhosHapContext對象讀取module.json5文件中的routerMap字段蹭劈,可以獲取系統(tǒng)路由表的名稱,再讀取profile目錄下的路由表线召。解析json文件內(nèi)存铺韧,并將頁面路徑寫到一個混淆文件中,這樣每次編譯時缓淹,自動生成防混淆文件哈打,我們只需要引入這個文件就可以了。示例如下
import { hapTasks, OhosHapContext, OhosPluginId } from '@ohos/hvigor-ohos-plugin'
import { HvigorPlugin, HvigorNode, FileUtil } from '@ohos/hvigor'
function parseRouterMap(): HvigorPlugin {
return {
pluginId: 'parseRouterMap',
apply(node: HvigorNode) {
const hapCtx = node.getContext(OhosPluginId.OHOS_HAP_PLUGIN) as OhosHapContext
const moduleJson = hapCtx.getModuleJsonOpt()
const routerMapName = moduleJson['module']['routerMap'].split(':')[1]
const dir = hapCtx.getModulePath()
const srcFile = FileUtil.pathResolve(dir, 'src', 'main', 'resources', 'base', 'profile', `${routerMapName}.json`)
const json = FileUtil.readJson5(srcFile)
const routerRuleFile = FileUtil.pathResolve(dir, 'obfuscation-router.txt')
FileUtil.ensureFileSync(routerRuleFile)
const routerMapArray = json['routerMap']
let rules = '-keep-file-name\n'
for (const element of routerMapArray) {
const pageSourceFile = element['pageSourceFile']
const path = pageSourceFile.substring(0, pageSourceFile.lastIndexOf('.'))
rules += `${path}\n`
}
FileUtil.writeFileSync(routerRuleFile, rules)
}
}
}
export default {
system: hapTasks,
plugins:[parseRouterMap()]
}
編譯后會在entry目錄下生成obfuscation-router.txt防混淆文件讯壶,只要引入這個文件就可以了料仗。
使用hvigorfile插件動態(tài)生成navigation頁面枚舉名稱
我們在我們navigation的push跳轉(zhuǎn)到新頁面時,都得提前定義好系統(tǒng)路由表中的頁面name伏蚊,因為使用的name與系統(tǒng)路由表中定義的name不相同時立轧,跳轉(zhuǎn)頁面則會白屏。有了前面的經(jīng)驗丙挽,其它我們也可以動態(tài)生成一個ets文件肺孵,將系統(tǒng)路由表中的頁面名稱自動生成一個枚舉,這樣就不用每次配置系統(tǒng)路由表颜阐,還是復(fù)制一下名稱了平窘。例如我們的系統(tǒng)路由表是這樣的
{
"routerMap": [
{
"name": "dialog",
"pageSourceFile": "src/main/ets/pages/dialog/DialogPage.ets",
"buildFunction": "dialogBuilder"
},
{
"name": "web",
"pageSourceFile": "src/main/ets/pages/web/WebPage.ets",
"buildFunction": "webBuilder"
},
{
"name": "login",
"pageSourceFile": "src/main/ets/pages/login/LoginPage.ets",
"buildFunction": "loginBuilder"
}
]
}
我們現(xiàn)在實現(xiàn)一個hvigorfile插件,來解析系統(tǒng)路由表中的name字段凳怨,并生成對應(yīng)的枚舉值瑰艘。示例如下
import { hapTasks, OhosHapContext, OhosPluginId } from '@ohos/hvigor-ohos-plugin'
import { HvigorPlugin, HvigorNode, FileUtil } from '@ohos/hvigor'
function parseRouterMap(): HvigorPlugin {
return {
pluginId: 'parseRouterMap',
apply(node: HvigorNode) {
const hapCtx = node.getContext(OhosPluginId.OHOS_HAP_PLUGIN) as OhosHapContext
const moduleJson = hapCtx.getModuleJsonOpt()
const routerMapName = moduleJson['module']['routerMap'].split(':')[1]
const dir = hapCtx.getModulePath()
const srcFile = FileUtil.pathResolve(dir, 'src', 'main', 'resources', 'base', 'profile', `${routerMapName}.json`)
const json = FileUtil.readJson5(srcFile)
const routerMapFile = FileUtil.pathResolve(dir, 'src', 'main', 'ets', 'Pages.ets')
FileUtil.ensureFileSync(routerMapFile)
const routerMapArray = json['routerMap']
let ss = ''
for (const element of routerMapArray) {
const name = element['name']
ss += ` ${name} = '${name}',\n`
}
ss = `export enum Pages {\n${ss}}`
FileUtil.writeFileSync(routerMapFile, ss)
}
}
}
export default {
system: hapTasks,
plugins:[parseRouterMap()]
}
我們在ets目錄下生成了一個Pages.ets文件,并將所有navigation頁面生成對應(yīng)的枚舉值肤舞,頁面跳轉(zhuǎn)時紫新,使用這些枚舉值就不怕出錯了。Pages.ets內(nèi)容如下
export enum Pages {
dialog = 'dialog',
web = 'web',
login = 'login',
}