[{"data":1,"prerenderedAt":1071},["ShallowReactive",2],{"navigation_docs":3,"-getting-started-first-game":159,"-getting-started-first-game-surround":1066},[4,29,57,76,100,124,152],{"title":5,"icon":6,"path":7,"stem":8,"children":9},"Getting Started","i-lucide-rocket","\u002Fgetting-started","1.getting-started",[10,12,16,20,24],{"title":5,"path":7,"stem":11},"1.getting-started\u002Findex",{"title":13,"path":14,"stem":15},"Installation","\u002Fgetting-started\u002Finstallation","1.getting-started\u002F1.installation",{"title":17,"path":18,"stem":19},"First Game","\u002Fgetting-started\u002Ffirst-game","1.getting-started\u002F2.first-game",{"title":21,"path":22,"stem":23},"SSR and Mounting","\u002Fgetting-started\u002Fssr-and-mounting","1.getting-started\u002F3.ssr-and-mounting",{"title":25,"path":26,"stem":27,"icon":28},"Skills","\u002Fgetting-started\u002Fskills","1.getting-started\u002F4.skills","i-lucide-sparkles",{"title":30,"icon":31,"path":32,"stem":33,"children":34},"Vue Guide","i-lucide-book-open","\u002Fvue-guide","2.vue-guide",[35,37,41,45,49,53],{"title":30,"path":32,"stem":36},"2.vue-guide\u002Findex",{"title":38,"path":39,"stem":40},"PhaserGame","\u002Fvue-guide\u002Fphaser-game","2.vue-guide\u002F1.phaser-game",{"title":42,"path":43,"stem":44},"Scenes","\u002Fvue-guide\u002Fscenes","2.vue-guide\u002F2.scenes",{"title":46,"path":47,"stem":48},"Primitives","\u002Fvue-guide\u002Fprimitives","2.vue-guide\u002F3.primitives",{"title":50,"path":51,"stem":52},"Composables and Bridge","\u002Fvue-guide\u002Fcomposables-and-bridge","2.vue-guide\u002F4.composables-and-bridge",{"title":54,"path":55,"stem":56},"Escape Hatches","\u002Fvue-guide\u002Fescape-hatches","2.vue-guide\u002F5.escape-hatches",{"title":58,"icon":59,"path":60,"stem":61,"children":62},"Nuxt Module","i-lucide-layers-3","\u002Fnuxt-module","3.nuxt-module",[63,65,68,72],{"title":58,"path":60,"stem":64},"3.nuxt-module\u002Findex",{"title":13,"path":66,"stem":67},"\u002Fnuxt-module\u002Finstallation","3.nuxt-module\u002F1.installation",{"title":69,"path":70,"stem":71},"Runtime Defaults","\u002Fnuxt-module\u002Fruntime-defaults","3.nuxt-module\u002F2.runtime-defaults",{"title":73,"path":74,"stem":75},"Client-only Wrapper","\u002Fnuxt-module\u002Fclient-only-wrapper","3.nuxt-module\u002F3.client-only-wrapper",{"title":77,"icon":78,"path":79,"stem":80,"children":81},"Examples","i-lucide-play-square","\u002Fexamples","4.examples",[82,84,88,92,96],{"title":77,"path":79,"stem":83},"4.examples\u002Findex",{"title":85,"path":86,"stem":87},"Minimal","\u002Fexamples\u002Fminimal","4.examples\u002F1.minimal",{"title":89,"path":90,"stem":91},"Imperative Escape Hatch","\u002Fexamples\u002Fimperative-escape-hatch","4.examples\u002F2.imperative-escape-hatch",{"title":93,"path":94,"stem":95},"Multi-scene","\u002Fexamples\u002Fmulti-scene","4.examples\u002F3.multi-scene",{"title":97,"path":98,"stem":99},"Nuxt Playground","\u002Fexamples\u002Fnuxt-playground","4.examples\u002F4.nuxt-playground",{"title":101,"icon":102,"path":103,"stem":104,"children":105},"API Reference","i-lucide-book-open-text","\u002Fapi-reference","5.api-reference",[106,108,112,116,120],{"title":101,"path":103,"stem":107},"5.api-reference\u002Findex",{"title":109,"path":110,"stem":111},"Vue Components","\u002Fapi-reference\u002Fvue-components","5.api-reference\u002F1.vue-components",{"title":113,"path":114,"stem":115},"Composables","\u002Fapi-reference\u002Fcomposables","5.api-reference\u002F2.composables",{"title":117,"path":118,"stem":119},"Types","\u002Fapi-reference\u002Ftypes","5.api-reference\u002F3.types",{"title":121,"path":122,"stem":123},"Nuxt Module Options","\u002Fapi-reference\u002Fnuxt-module-options","5.api-reference\u002F4.nuxt-module-options",{"title":125,"icon":126,"path":127,"stem":128,"children":129},"Guides","i-lucide-compass","\u002Fguides","6.guides",[130,132,136,140,144,148],{"title":125,"path":127,"stem":131},"6.guides\u002Findex",{"title":133,"path":134,"stem":135},"Performance","\u002Fguides\u002Fperformance","6.guides\u002F1.performance",{"title":137,"path":138,"stem":139},"Scene-first Design","\u002Fguides\u002Fscene-first-design","6.guides\u002F2.scene-first-design",{"title":141,"path":142,"stem":143},"Vue Reactivity vs Phaser Imperative Updates","\u002Fguides\u002Fvue-reactivity-vs-phaser-imperative-updates","6.guides\u002F3.vue-reactivity-vs-phaser-imperative-updates",{"title":145,"path":146,"stem":147},"Testing scene primitives in Vue","\u002Fguides\u002Ftesting-scene-primitives-in-vue","6.guides\u002F4.testing-scene-primitives-in-vue",{"title":149,"path":150,"stem":151},"Testing a Phaser canvas in Nuxt","\u002Fguides\u002Ftesting-a-phaser-canvas-in-nuxt","6.guides\u002F5.testing-a-phaser-canvas-in-nuxt",{"title":153,"path":154,"stem":155,"children":156,"icon":158},"Roadmap","\u002Froadmap","7.roadmap\u002Findex",[157],{"title":153,"path":154,"stem":155},"i-lucide-flag",{"id":160,"title":17,"body":161,"description":1060,"extension":1061,"links":1062,"meta":1063,"navigation":275,"path":18,"seo":1064,"stem":19,"__hash__":1065},"docs\u002F1.getting-started\u002F2.first-game.md",{"type":162,"value":163,"toc":1055},"minimark",[164,168,187,190,988,993,996,1007,1011,1035,1039,1043,1051],[165,166,167],"p",{},"Your first game should prove the core contract:",[169,170,171,178,184],"ul",{},[172,173,174,177],"li",{},[175,176,38],"code",{}," creates and owns the game instance",[172,179,180,183],{},[175,181,182],{},"PhaserScene"," registers a managed scene",[172,185,186],{},"the bridge connects DOM UI and scene code without a global singleton",[165,188,189],{},"This example uses the Vue runtime directly. The same scene and bridge pattern still applies in Nuxt.",[191,192,198],"pre",{"className":193,"code":194,"filename":195,"language":196,"meta":197,"style":197},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cscript setup lang=\"ts\">\nimport { definePhaserScene, usePhaserBridge } from '@onmax\u002Fphaser-vue'\n\ninterface DemoBridge {\n  'hud:boost': { amount: number }\n}\n\nconst scene = definePhaserScene\u003CDemoBridge>({\n  key: 'main',\n  preload({ scene }) {\n    scene.load.image('logo', 'https:\u002F\u002Flabs.phaser.io\u002Fassets\u002Fsprites\u002Fphaser3-logo.png')\n  },\n  create({ scene, bridge }) {\n    scene.add.image(400, 160, 'logo').setScale(0.45)\n    const scoreText = scene.add.text(32, 32, 'Score: 0', { color: '#ffffff', fontSize: '28px' })\n    let score = 0\n\n    bridge.on('hud:boost', ({ amount }) => {\n      score += amount\n      scoreText.setText(`Score: ${score}`)\n    })\n  },\n})\n\nconst bridge = usePhaserBridge\u003CDemoBridge>('minimal-demo')\n\nfunction boostScore() {\n  bridge?.emit('hud:boost', { amount: 5 })\n}\n\u003C\u002Fscript>\n\n\u003Ctemplate>\n  \u003Cmain>\n    \u003Cbutton @click=\"boostScore\">\n      Add 5 points\n    \u003C\u002Fbutton>\n\n    \u003CPhaserGame instance-id=\"minimal-demo\" :width=\"800\" :height=\"480\" background-color=\"#16213e\" debug>\n      \u003CPhaserScene scene-key=\"main\" :definition=\"scene\" \u002F>\n    \u003C\u002FPhaserGame>\n  \u003C\u002Fmain>\n\u003C\u002Ftemplate>\n","src\u002FApp.vue","vue","",[175,199,200,235,270,277,290,318,324,329,357,375,393,431,437,456,504,580,594,599,632,644,674,682,687,695,700,729,734,748,783,788,798,803,813,823,846,852,862,867,926,960,969,979],{"__ignoreMap":197},[201,202,205,209,213,217,220,223,226,230,232],"span",{"class":203,"line":204},"line",1,[201,206,208],{"class":207},"sMK4o","\u003C",[201,210,212],{"class":211},"swJcz","script",[201,214,216],{"class":215},"spNyl"," setup",[201,218,219],{"class":215}," lang",[201,221,222],{"class":207},"=",[201,224,225],{"class":207},"\"",[201,227,229],{"class":228},"sfazB","ts",[201,231,225],{"class":207},[201,233,234],{"class":207},">\n",[201,236,238,242,245,249,252,255,258,261,264,267],{"class":203,"line":237},2,[201,239,241],{"class":240},"s7zQu","import",[201,243,244],{"class":207}," {",[201,246,248],{"class":247},"sTEyZ"," definePhaserScene",[201,250,251],{"class":207},",",[201,253,254],{"class":247}," usePhaserBridge",[201,256,257],{"class":207}," }",[201,259,260],{"class":240}," from",[201,262,263],{"class":207}," '",[201,265,266],{"class":228},"@onmax\u002Fphaser-vue",[201,268,269],{"class":207},"'\n",[201,271,273],{"class":203,"line":272},3,[201,274,276],{"emptyLinePlaceholder":275},true,"\n",[201,278,280,283,287],{"class":203,"line":279},4,[201,281,282],{"class":215},"interface",[201,284,286],{"class":285},"sBMFI"," DemoBridge",[201,288,289],{"class":207}," {\n",[201,291,293,296,299,302,305,307,310,312,315],{"class":203,"line":292},5,[201,294,295],{"class":207},"  '",[201,297,298],{"class":228},"hud:boost",[201,300,301],{"class":207},"'",[201,303,304],{"class":207},":",[201,306,244],{"class":207},[201,308,309],{"class":211}," amount",[201,311,304],{"class":207},[201,313,314],{"class":285}," number",[201,316,317],{"class":207}," }\n",[201,319,321],{"class":203,"line":320},6,[201,322,323],{"class":207},"}\n",[201,325,327],{"class":203,"line":326},7,[201,328,276],{"emptyLinePlaceholder":275},[201,330,332,335,338,340,343,345,348,351,354],{"class":203,"line":331},8,[201,333,334],{"class":215},"const",[201,336,337],{"class":247}," scene ",[201,339,222],{"class":207},[201,341,248],{"class":342},"s2Zo4",[201,344,208],{"class":207},[201,346,347],{"class":285},"DemoBridge",[201,349,350],{"class":207},">",[201,352,353],{"class":247},"(",[201,355,356],{"class":207},"{\n",[201,358,360,363,365,367,370,372],{"class":203,"line":359},9,[201,361,362],{"class":211},"  key",[201,364,304],{"class":207},[201,366,263],{"class":207},[201,368,369],{"class":228},"main",[201,371,301],{"class":207},[201,373,374],{"class":207},",\n",[201,376,378,381,384,388,391],{"class":203,"line":377},10,[201,379,380],{"class":211},"  preload",[201,382,383],{"class":207},"({",[201,385,387],{"class":386},"sHdIc"," scene",[201,389,390],{"class":207}," })",[201,392,289],{"class":207},[201,394,396,399,402,405,407,410,412,414,417,419,421,423,426,428],{"class":203,"line":395},11,[201,397,398],{"class":247},"    scene",[201,400,401],{"class":207},".",[201,403,404],{"class":247},"load",[201,406,401],{"class":207},[201,408,409],{"class":342},"image",[201,411,353],{"class":211},[201,413,301],{"class":207},[201,415,416],{"class":228},"logo",[201,418,301],{"class":207},[201,420,251],{"class":207},[201,422,263],{"class":207},[201,424,425],{"class":228},"https:\u002F\u002Flabs.phaser.io\u002Fassets\u002Fsprites\u002Fphaser3-logo.png",[201,427,301],{"class":207},[201,429,430],{"class":211},")\n",[201,432,434],{"class":203,"line":433},12,[201,435,436],{"class":207},"  },\n",[201,438,440,443,445,447,449,452,454],{"class":203,"line":439},13,[201,441,442],{"class":211},"  create",[201,444,383],{"class":207},[201,446,387],{"class":386},[201,448,251],{"class":207},[201,450,451],{"class":386}," bridge",[201,453,390],{"class":207},[201,455,289],{"class":207},[201,457,459,461,463,466,468,470,472,476,478,481,483,485,487,489,492,494,497,499,502],{"class":203,"line":458},14,[201,460,398],{"class":247},[201,462,401],{"class":207},[201,464,465],{"class":247},"add",[201,467,401],{"class":207},[201,469,409],{"class":342},[201,471,353],{"class":211},[201,473,475],{"class":474},"sbssI","400",[201,477,251],{"class":207},[201,479,480],{"class":474}," 160",[201,482,251],{"class":207},[201,484,263],{"class":207},[201,486,416],{"class":228},[201,488,301],{"class":207},[201,490,491],{"class":211},")",[201,493,401],{"class":207},[201,495,496],{"class":342},"setScale",[201,498,353],{"class":211},[201,500,501],{"class":474},"0.45",[201,503,430],{"class":211},[201,505,507,510,513,516,518,520,522,524,527,529,532,534,537,539,541,544,546,548,550,553,555,557,560,562,564,567,569,571,574,576,578],{"class":203,"line":506},15,[201,508,509],{"class":215},"    const",[201,511,512],{"class":247}," scoreText",[201,514,515],{"class":207}," =",[201,517,387],{"class":247},[201,519,401],{"class":207},[201,521,465],{"class":247},[201,523,401],{"class":207},[201,525,526],{"class":342},"text",[201,528,353],{"class":211},[201,530,531],{"class":474},"32",[201,533,251],{"class":207},[201,535,536],{"class":474}," 32",[201,538,251],{"class":207},[201,540,263],{"class":207},[201,542,543],{"class":228},"Score: 0",[201,545,301],{"class":207},[201,547,251],{"class":207},[201,549,244],{"class":207},[201,551,552],{"class":211}," color",[201,554,304],{"class":207},[201,556,263],{"class":207},[201,558,559],{"class":228},"#ffffff",[201,561,301],{"class":207},[201,563,251],{"class":207},[201,565,566],{"class":211}," fontSize",[201,568,304],{"class":207},[201,570,263],{"class":207},[201,572,573],{"class":228},"28px",[201,575,301],{"class":207},[201,577,257],{"class":207},[201,579,430],{"class":211},[201,581,583,586,589,591],{"class":203,"line":582},16,[201,584,585],{"class":215},"    let",[201,587,588],{"class":247}," score",[201,590,515],{"class":207},[201,592,593],{"class":474}," 0\n",[201,595,597],{"class":203,"line":596},17,[201,598,276],{"emptyLinePlaceholder":275},[201,600,602,605,607,610,612,614,616,618,620,623,625,627,630],{"class":203,"line":601},18,[201,603,604],{"class":247},"    bridge",[201,606,401],{"class":207},[201,608,609],{"class":342},"on",[201,611,353],{"class":211},[201,613,301],{"class":207},[201,615,298],{"class":228},[201,617,301],{"class":207},[201,619,251],{"class":207},[201,621,622],{"class":207}," ({",[201,624,309],{"class":386},[201,626,390],{"class":207},[201,628,629],{"class":215}," =>",[201,631,289],{"class":207},[201,633,635,638,641],{"class":203,"line":634},19,[201,636,637],{"class":247},"      score",[201,639,640],{"class":207}," +=",[201,642,643],{"class":247}," amount\n",[201,645,647,650,652,655,657,660,663,666,669,672],{"class":203,"line":646},20,[201,648,649],{"class":247},"      scoreText",[201,651,401],{"class":207},[201,653,654],{"class":342},"setText",[201,656,353],{"class":211},[201,658,659],{"class":207},"`",[201,661,662],{"class":228},"Score: ",[201,664,665],{"class":207},"${",[201,667,668],{"class":247},"score",[201,670,671],{"class":207},"}`",[201,673,430],{"class":211},[201,675,677,680],{"class":203,"line":676},21,[201,678,679],{"class":207},"    }",[201,681,430],{"class":211},[201,683,685],{"class":203,"line":684},22,[201,686,436],{"class":207},[201,688,690,693],{"class":203,"line":689},23,[201,691,692],{"class":207},"}",[201,694,430],{"class":247},[201,696,698],{"class":203,"line":697},24,[201,699,276],{"emptyLinePlaceholder":275},[201,701,703,705,708,710,712,714,716,718,720,722,725,727],{"class":203,"line":702},25,[201,704,334],{"class":215},[201,706,707],{"class":247}," bridge ",[201,709,222],{"class":207},[201,711,254],{"class":342},[201,713,208],{"class":207},[201,715,347],{"class":285},[201,717,350],{"class":207},[201,719,353],{"class":247},[201,721,301],{"class":207},[201,723,724],{"class":228},"minimal-demo",[201,726,301],{"class":207},[201,728,430],{"class":247},[201,730,732],{"class":203,"line":731},26,[201,733,276],{"emptyLinePlaceholder":275},[201,735,737,740,743,746],{"class":203,"line":736},27,[201,738,739],{"class":215},"function",[201,741,742],{"class":342}," boostScore",[201,744,745],{"class":207},"()",[201,747,289],{"class":207},[201,749,751,754,757,760,762,764,766,768,770,772,774,776,779,781],{"class":203,"line":750},28,[201,752,753],{"class":247},"  bridge",[201,755,756],{"class":207},"?.",[201,758,759],{"class":342},"emit",[201,761,353],{"class":211},[201,763,301],{"class":207},[201,765,298],{"class":228},[201,767,301],{"class":207},[201,769,251],{"class":207},[201,771,244],{"class":207},[201,773,309],{"class":211},[201,775,304],{"class":207},[201,777,778],{"class":474}," 5",[201,780,257],{"class":207},[201,782,430],{"class":211},[201,784,786],{"class":203,"line":785},29,[201,787,323],{"class":207},[201,789,791,794,796],{"class":203,"line":790},30,[201,792,793],{"class":207},"\u003C\u002F",[201,795,212],{"class":211},[201,797,234],{"class":207},[201,799,801],{"class":203,"line":800},31,[201,802,276],{"emptyLinePlaceholder":275},[201,804,806,808,811],{"class":203,"line":805},32,[201,807,208],{"class":207},[201,809,810],{"class":211},"template",[201,812,234],{"class":207},[201,814,816,819,821],{"class":203,"line":815},33,[201,817,818],{"class":207},"  \u003C",[201,820,369],{"class":211},[201,822,234],{"class":207},[201,824,826,829,832,835,837,839,842,844],{"class":203,"line":825},34,[201,827,828],{"class":207},"    \u003C",[201,830,831],{"class":211},"button",[201,833,834],{"class":215}," @click",[201,836,222],{"class":207},[201,838,225],{"class":207},[201,840,841],{"class":228},"boostScore",[201,843,225],{"class":207},[201,845,234],{"class":207},[201,847,849],{"class":203,"line":848},35,[201,850,851],{"class":247},"      Add 5 points\n",[201,853,855,858,860],{"class":203,"line":854},36,[201,856,857],{"class":207},"    \u003C\u002F",[201,859,831],{"class":211},[201,861,234],{"class":207},[201,863,865],{"class":203,"line":864},37,[201,866,276],{"emptyLinePlaceholder":275},[201,868,870,872,874,877,879,881,883,885,888,890,892,895,897,900,902,904,907,909,912,914,916,919,921,924],{"class":203,"line":869},38,[201,871,828],{"class":207},[201,873,38],{"class":211},[201,875,876],{"class":215}," instance-id",[201,878,222],{"class":207},[201,880,225],{"class":207},[201,882,724],{"class":228},[201,884,225],{"class":207},[201,886,887],{"class":215}," :width",[201,889,222],{"class":207},[201,891,225],{"class":207},[201,893,894],{"class":228},"800",[201,896,225],{"class":207},[201,898,899],{"class":215}," :height",[201,901,222],{"class":207},[201,903,225],{"class":207},[201,905,906],{"class":228},"480",[201,908,225],{"class":207},[201,910,911],{"class":215}," background-color",[201,913,222],{"class":207},[201,915,225],{"class":207},[201,917,918],{"class":228},"#16213e",[201,920,225],{"class":207},[201,922,923],{"class":215}," debug",[201,925,234],{"class":207},[201,927,929,932,934,937,939,941,943,945,948,950,952,955,957],{"class":203,"line":928},39,[201,930,931],{"class":207},"      \u003C",[201,933,182],{"class":211},[201,935,936],{"class":215}," scene-key",[201,938,222],{"class":207},[201,940,225],{"class":207},[201,942,369],{"class":228},[201,944,225],{"class":207},[201,946,947],{"class":215}," :definition",[201,949,222],{"class":207},[201,951,225],{"class":207},[201,953,954],{"class":228},"scene",[201,956,225],{"class":207},[201,958,959],{"class":207}," \u002F>\n",[201,961,963,965,967],{"class":203,"line":962},40,[201,964,857],{"class":207},[201,966,38],{"class":211},[201,968,234],{"class":207},[201,970,972,975,977],{"class":203,"line":971},41,[201,973,974],{"class":207},"  \u003C\u002F",[201,976,369],{"class":211},[201,978,234],{"class":207},[201,980,982,984,986],{"class":203,"line":981},42,[201,983,793],{"class":207},[201,985,810],{"class":211},[201,987,234],{"class":207},[989,990,992],"h2",{"id":991},"verify-the-result","Verify the result",[165,994,995],{},"When this page is wired correctly:",[169,997,998,1001,1004],{},[172,999,1000],{},"the canvas mounts once",[172,1002,1003],{},"the Phaser logo renders inside the scene",[172,1005,1006],{},"clicking the button increments the score text in the canvas",[989,1008,1010],{"id":1009},"what-each-piece-owns","What each piece owns",[169,1012,1013,1018,1023,1029],{},[172,1014,1015,1017],{},[175,1016,38],{}," mounts Phaser into a container element and exposes the game instance.",[172,1019,1020,1022],{},[175,1021,182],{}," registers a managed scene with a stable key.",[172,1024,1025,1028],{},[175,1026,1027],{},"definePhaserScene"," keeps lifecycle code in plain Phaser terms.",[172,1030,1031,1034],{},[175,1032,1033],{},"usePhaserBridge"," returns the per-game bridge so DOM UI can emit events into the scene.",[1036,1037,1038],"tip",{},"Start with one scene and a typed bridge event. That proves the wiring before you add primitives or multiple scenes.",[989,1040,1042],{"id":1041},"next-step","Next step",[165,1044,1045,1046,1050],{},"Continue with ",[1047,1048,1049],"a",{"href":22},"SSR and mounting"," if you are integrating this into a server-rendered app or a Nuxt codebase.",[1052,1053,1054],"style",{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .sbssI, html code.shiki .sbssI{--shiki-light:#F76D47;--shiki-default:#F78C6C;--shiki-dark:#F78C6C}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":197,"searchDepth":237,"depth":237,"links":1056},[1057,1058,1059],{"id":991,"depth":237,"text":992},{"id":1009,"depth":237,"text":1010},{"id":1041,"depth":237,"text":1042},"Mount PhaserGame, register a scene, and connect Vue UI to the canvas through the typed bridge.","md",null,{},{"title":17,"description":1060},"MFC43jaRbpGWnLpXvvA7gUI61oYxwOI8ikgCdHcLDZ8",[1067,1069],{"title":13,"path":14,"stem":15,"description":1068,"children":-1},"Install @onmax\u002Fphaser-vue or @onmax\u002Fnuxt-phaser and wire the runtime without hiding Phaser.",{"title":21,"path":22,"stem":23,"description":1070,"children":-1},"Keep Phaser client-only, avoid hydration footguns, and choose the right host component in Vue and Nuxt.",1777965859985]