builder-webview

初始化

- 新建一个项目目录如 my-project
- 将游戏引擎导出的文件复制到 my-project 目录内, 如 game-files
- 进入 my-project 目录, 执行 npm init -y 初始化项目
- 添加 @hyext/cli 依赖: npm i @hyext/cli -D
- 生成配置: npx @hyext/cli init -b @hyext/builder-webview

配置

builder-webview 的配置在 project.config.json 的 builder.config 中配置:
``ts
// 具体内容请查看 src/typings.ts
export interface BuilderConfig {}
`

其中 buildConfig 的类型为:
`ts
// 具体内容请查看 src/typings.ts
export interface BuildConfig {}
`

开发, 测试, 发布

在虎牙直播APP或者虎牙直播助等app环境执行时, 可使用 buildConfig 的 entry 字段来指定入口的 react-native 文件.
如果想直接显示html的内容, 可使用 @hyext/gameview 组件来简化编码, 详情请翻阅 gameview 文档

其他流程请翻阅虎牙小程序官方文档: https://dev.huya.com/docs/

插件

可以在配置里添加插件来跑一些自动化的脚本, 在 project.config.json 的 builder.config.plugins 中配置插件.
形式和babel插件类似, plugins中的每一项都是一个数组, 第一项是插件的名称, 第二项是插件的参数. 如果不需要配置参数, 也可以直接写插件名称

插件名称可以写成相对路径, 绝对路径, 也可以写成npm包名
为了安全考虑, 在云端构建时, 只有在白名单内的npm包(以@hyext开头)才会生效

目前同一个钩子的插件会按出现的顺序执行.

可配置如下钩子:
- preStart: 开发阶段, 在builder启动内置开发服务器前执行
- startResolved: 开发阶段, 在builder内置开发服务器就绪后执行
- preRelease: 在执行 hyext-release 打包代码, 打包前执行
- releaseEnd: 在执行 hyext-release 打包代码, 打包完成后执行

插件以函数的形式存在, 该函数返回一个 PluginConfig 对象:
`ts
export interface PluginConfig {
name: string

preStart?: (opt: StartPluginOpt) => void
startResolved?: (opt: StartPluginOpt) => void
preRelease?: (opt: ReleasePluginOpt) => void
releaseEnd?: (opt: ReleasePluginOpt) => void
}

export type ProjectConfig = ExtCLI.ProjectConfig
interface PluginContext {
projectConfig: ProjectConfig
inputPath: string
error?: Error
}
type StartPluginOpt = PluginContext & { distDir: string, buildResult?: ExtCLI.BuildResult }
type ReleasePluginOpt = PluginContext & { releaseDir: string, releaseZip?: string }

`


一个简单的例子如下:
`ts
// plugin-demo.js
const sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms))

module.exports = function (options) {
return {
name: 'plugin-1-name',
preStart: async (opt) => {
await sleep(1000)
console.log('plugin-1 preStart', opt)
},
startResolved: async (opt) => {
console.log('error.message', opt.error.message)
await sleep(2000)
console.log('plugin-1 startDone', opt)
},

preRelease: async (opt) => {
await sleep(2000)
console.log('preRelease', opt)
},
releaseEnd: async (opt) => {
await sleep(2000)
console.log('releaseEnd', opt)
},
}
}

// project.config.json

{
"builder": {
"name": "@hyext/builder-webview",
"config": {
"webTitle": "TestAuto2",
"https": true,
"h5Dir": "h5",
"buildConfig": [
],
"plugins": [
[
"./plugin-demo.js",
{
"bar": true,
}
]
]
}
}
}
``