[{"data":1,"prerenderedAt":4361},["Reactive",2],{"navigation":3,"docs-/module/guide":37,"docs-/module/guide-surround":2570},[4,17,30],{"title":5,"_path":6,"children":7},"Guide","/guide",[8,11,14],{"title":9,"_path":10},"Getting Started","/guide/getting-started",{"title":12,"_path":13},"Features","/guide/features",{"title":15,"_path":16},"Composables","/guide/composables",{"title":18,"_path":19,"children":20},"Module","/module",[21,24,27],{"title":22,"_path":23},"Module Authors","/module/guide",{"title":25,"_path":26},"Utility Kit","/module/utils-kit",{"title":28,"_path":29},"UI Kit","/module/ui-kit",{"title":31,"_path":32,"children":33},"Development","/development",[34],{"title":35,"_path":36},"Contribution Guide","/development/contributing",{"_path":23,"_dir":38,"_draft":39,"_partial":39,"_locale":40,"title":22,"description":41,"body":42,"_type":2565,"_id":2566,"_source":2567,"_file":2568,"_extension":2569},"module",false,"","Add your own modules integration to the Nuxt DevTools.",{"type":43,"children":44,"toc":2556},"root",[45,53,60,65,114,119,125,130,135,444,449,764,776,782,787,1428,1440,1458,1464,1476,1482,1487,1492,1623,1628,2111,2116,2462,2468,2473,2483,2489,2494,2550],{"type":46,"tag":47,"props":48,"children":49},"element","p",{},[50],{"type":51,"value":52},"text","Nuxt DevTools is designed to be extensible. You can add your own modules integration to the DevTools.",{"type":46,"tag":54,"props":55,"children":57},"h2",{"id":56},"starter-template",[58],{"type":51,"value":59},"Starter Template",{"type":46,"tag":47,"props":61,"children":62},{},[63],{"type":51,"value":64},"If you want to try integrating with Nuxt DevTools, you can run",{"type":46,"tag":66,"props":67,"children":71},"pre",{"className":68,"code":69,"language":70,"meta":40,"style":40},"language-bash shiki shiki-themes material-theme material-theme-palenight material-theme-lighter","npx nuxi init my-module -t module-devtools\n","bash",[72],{"type":46,"tag":73,"props":74,"children":75},"code",{"__ignoreMap":40},[76],{"type":46,"tag":77,"props":78,"children":81},"span",{"class":79,"line":80},"line",1,[82,88,94,99,104,109],{"type":46,"tag":77,"props":83,"children":85},{"style":84},"color:#FFCB6B;--shiki-dark:#FFCB6B;--shiki-light:#E2931D",[86],{"type":51,"value":87},"npx",{"type":46,"tag":77,"props":89,"children":91},{"style":90},"color:#C3E88D;--shiki-dark:#C3E88D;--shiki-light:#91B859",[92],{"type":51,"value":93}," nuxi",{"type":46,"tag":77,"props":95,"children":96},{"style":90},[97],{"type":51,"value":98}," init",{"type":46,"tag":77,"props":100,"children":101},{"style":90},[102],{"type":51,"value":103}," my-module",{"type":46,"tag":77,"props":105,"children":106},{"style":90},[107],{"type":51,"value":108}," -t",{"type":46,"tag":77,"props":110,"children":111},{"style":90},[112],{"type":51,"value":113}," module-devtools",{"type":46,"tag":47,"props":115,"children":116},{},[117],{"type":51,"value":118},"to create a new module starter with Nuxt DevTools integration pre-configured (contributing a fully custom view as a tab).",{"type":46,"tag":54,"props":120,"children":122},{"id":121},"contributing-to-view",[123],{"type":51,"value":124},"Contributing to View",{"type":46,"tag":47,"props":126,"children":127},{},[128],{"type":51,"value":129},"Currently the only way to contribute to Nuxt DevTools View is via iframe. You need to serve your module's view yourself and then register it to the DevTools.",{"type":46,"tag":47,"props":131,"children":132},{},[133],{"type":51,"value":134},"You can use the utility kit provided by Nuxt DevTools to register your custom tab:",{"type":46,"tag":66,"props":136,"children":140},{"className":137,"code":138,"language":139,"meta":40,"style":40},"language-ts shiki shiki-themes material-theme material-theme-palenight material-theme-lighter","import { addCustomTab } from '@nuxt/devtools-kit'\n\naddCustomTab({\n // unique identifier\n name: 'my-module',\n // title to display in the tab\n title: 'My Module',\n // any icon from Iconify, or a URL to an image\n icon: 'carbon:apps',\n // iframe view\n view: {\n type: 'iframe',\n src: '/url-to-your-module-view',\n },\n})\n","ts",[141],{"type":46,"tag":73,"props":142,"children":143},{"__ignoreMap":40},[144,190,194,214,224,257,266,296,305,335,344,361,391,421,430],{"type":46,"tag":77,"props":145,"children":146},{"class":79,"line":80},[147,153,159,165,170,175,180,185],{"type":46,"tag":77,"props":148,"children":150},{"style":149},"color:#89DDFF;--shiki-dark:#89DDFF;--shiki-light:#39ADB5;font-style:italic;--shiki-dark-font-style:italic;--shiki-light-font-style:italic",[151],{"type":51,"value":152},"import",{"type":46,"tag":77,"props":154,"children":156},{"style":155},"color:#89DDFF;--shiki-dark:#89DDFF;--shiki-light:#39ADB5",[157],{"type":51,"value":158}," {",{"type":46,"tag":77,"props":160,"children":162},{"style":161},"color:#EEFFFF;--shiki-dark:#BABED8;--shiki-light:#90A4AE",[163],{"type":51,"value":164}," addCustomTab",{"type":46,"tag":77,"props":166,"children":167},{"style":155},[168],{"type":51,"value":169}," }",{"type":46,"tag":77,"props":171,"children":172},{"style":149},[173],{"type":51,"value":174}," from",{"type":46,"tag":77,"props":176,"children":177},{"style":155},[178],{"type":51,"value":179}," '",{"type":46,"tag":77,"props":181,"children":182},{"style":90},[183],{"type":51,"value":184},"@nuxt/devtools-kit",{"type":46,"tag":77,"props":186,"children":187},{"style":155},[188],{"type":51,"value":189},"'",{"type":46,"tag":77,"props":191,"children":193},{"class":79,"line":192},2,[],{"type":46,"tag":77,"props":195,"children":197},{"class":79,"line":196},3,[198,204,209],{"type":46,"tag":77,"props":199,"children":201},{"style":200},"color:#82AAFF;--shiki-dark:#82AAFF;--shiki-light:#6182B8",[202],{"type":51,"value":203},"addCustomTab",{"type":46,"tag":77,"props":205,"children":206},{"style":161},[207],{"type":51,"value":208},"(",{"type":46,"tag":77,"props":210,"children":211},{"style":155},[212],{"type":51,"value":213},"{",{"type":46,"tag":77,"props":215,"children":217},{"class":79,"line":216},4,[218],{"type":46,"tag":77,"props":219,"children":221},{"style":220},"color:#546E7A;--shiki-dark:#676E95;--shiki-light:#90A4AE;font-style:italic;--shiki-dark-font-style:italic;--shiki-light-font-style:italic",[222],{"type":51,"value":223}," // unique identifier",{"type":46,"tag":77,"props":225,"children":227},{"class":79,"line":226},5,[228,234,239,243,248,252],{"type":46,"tag":77,"props":229,"children":231},{"style":230},"color:#F07178;--shiki-dark:#F07178;--shiki-light:#E53935",[232],{"type":51,"value":233}," name",{"type":46,"tag":77,"props":235,"children":236},{"style":155},[237],{"type":51,"value":238},":",{"type":46,"tag":77,"props":240,"children":241},{"style":155},[242],{"type":51,"value":179},{"type":46,"tag":77,"props":244,"children":245},{"style":90},[246],{"type":51,"value":247},"my-module",{"type":46,"tag":77,"props":249,"children":250},{"style":155},[251],{"type":51,"value":189},{"type":46,"tag":77,"props":253,"children":254},{"style":155},[255],{"type":51,"value":256},",",{"type":46,"tag":77,"props":258,"children":260},{"class":79,"line":259},6,[261],{"type":46,"tag":77,"props":262,"children":263},{"style":220},[264],{"type":51,"value":265}," // title to display in the tab",{"type":46,"tag":77,"props":267,"children":269},{"class":79,"line":268},7,[270,275,279,283,288,292],{"type":46,"tag":77,"props":271,"children":272},{"style":230},[273],{"type":51,"value":274}," title",{"type":46,"tag":77,"props":276,"children":277},{"style":155},[278],{"type":51,"value":238},{"type":46,"tag":77,"props":280,"children":281},{"style":155},[282],{"type":51,"value":179},{"type":46,"tag":77,"props":284,"children":285},{"style":90},[286],{"type":51,"value":287},"My Module",{"type":46,"tag":77,"props":289,"children":290},{"style":155},[291],{"type":51,"value":189},{"type":46,"tag":77,"props":293,"children":294},{"style":155},[295],{"type":51,"value":256},{"type":46,"tag":77,"props":297,"children":299},{"class":79,"line":298},8,[300],{"type":46,"tag":77,"props":301,"children":302},{"style":220},[303],{"type":51,"value":304}," // any icon from Iconify, or a URL to an image",{"type":46,"tag":77,"props":306,"children":308},{"class":79,"line":307},9,[309,314,318,322,327,331],{"type":46,"tag":77,"props":310,"children":311},{"style":230},[312],{"type":51,"value":313}," icon",{"type":46,"tag":77,"props":315,"children":316},{"style":155},[317],{"type":51,"value":238},{"type":46,"tag":77,"props":319,"children":320},{"style":155},[321],{"type":51,"value":179},{"type":46,"tag":77,"props":323,"children":324},{"style":90},[325],{"type":51,"value":326},"carbon:apps",{"type":46,"tag":77,"props":328,"children":329},{"style":155},[330],{"type":51,"value":189},{"type":46,"tag":77,"props":332,"children":333},{"style":155},[334],{"type":51,"value":256},{"type":46,"tag":77,"props":336,"children":338},{"class":79,"line":337},10,[339],{"type":46,"tag":77,"props":340,"children":341},{"style":220},[342],{"type":51,"value":343}," // iframe view",{"type":46,"tag":77,"props":345,"children":347},{"class":79,"line":346},11,[348,353,357],{"type":46,"tag":77,"props":349,"children":350},{"style":230},[351],{"type":51,"value":352}," view",{"type":46,"tag":77,"props":354,"children":355},{"style":155},[356],{"type":51,"value":238},{"type":46,"tag":77,"props":358,"children":359},{"style":155},[360],{"type":51,"value":158},{"type":46,"tag":77,"props":362,"children":364},{"class":79,"line":363},12,[365,370,374,378,383,387],{"type":46,"tag":77,"props":366,"children":367},{"style":230},[368],{"type":51,"value":369}," type",{"type":46,"tag":77,"props":371,"children":372},{"style":155},[373],{"type":51,"value":238},{"type":46,"tag":77,"props":375,"children":376},{"style":155},[377],{"type":51,"value":179},{"type":46,"tag":77,"props":379,"children":380},{"style":90},[381],{"type":51,"value":382},"iframe",{"type":46,"tag":77,"props":384,"children":385},{"style":155},[386],{"type":51,"value":189},{"type":46,"tag":77,"props":388,"children":389},{"style":155},[390],{"type":51,"value":256},{"type":46,"tag":77,"props":392,"children":394},{"class":79,"line":393},13,[395,400,404,408,413,417],{"type":46,"tag":77,"props":396,"children":397},{"style":230},[398],{"type":51,"value":399}," src",{"type":46,"tag":77,"props":401,"children":402},{"style":155},[403],{"type":51,"value":238},{"type":46,"tag":77,"props":405,"children":406},{"style":155},[407],{"type":51,"value":179},{"type":46,"tag":77,"props":409,"children":410},{"style":90},[411],{"type":51,"value":412},"/url-to-your-module-view",{"type":46,"tag":77,"props":414,"children":415},{"style":155},[416],{"type":51,"value":189},{"type":46,"tag":77,"props":418,"children":419},{"style":155},[420],{"type":51,"value":256},{"type":46,"tag":77,"props":422,"children":424},{"class":79,"line":423},14,[425],{"type":46,"tag":77,"props":426,"children":427},{"style":155},[428],{"type":51,"value":429}," },",{"type":46,"tag":77,"props":431,"children":433},{"class":79,"line":432},15,[434,439],{"type":46,"tag":77,"props":435,"children":436},{"style":155},[437],{"type":51,"value":438},"}",{"type":46,"tag":77,"props":440,"children":441},{"style":161},[442],{"type":51,"value":443},")",{"type":46,"tag":47,"props":445,"children":446},{},[447],{"type":51,"value":448},"Or if you prefer to use Nuxt hooks:",{"type":46,"tag":66,"props":450,"children":452},{"className":137,"code":451,"language":139,"meta":40,"style":40},"nuxt.hook('devtools:customTabs', (tabs) => {\n tabs.push({\n // unique identifier\n name: 'my-module',\n // title to display in the tab\n title: 'My Module',\n // any icon from Iconify, or a URL to an image\n icon: 'carbon:apps',\n // iframe view\n view: {\n type: 'iframe',\n src: '/url-to-your-module-view',\n },\n })\n})\n",[453],{"type":46,"tag":73,"props":454,"children":455},{"__ignoreMap":40},[456,520,545,553,581,589,617,625,653,661,677,705,733,741,753],{"type":46,"tag":77,"props":457,"children":458},{"class":79,"line":80},[459,464,469,474,478,482,487,491,495,500,506,510,516],{"type":46,"tag":77,"props":460,"children":461},{"style":161},[462],{"type":51,"value":463},"nuxt",{"type":46,"tag":77,"props":465,"children":466},{"style":155},[467],{"type":51,"value":468},".",{"type":46,"tag":77,"props":470,"children":471},{"style":200},[472],{"type":51,"value":473},"hook",{"type":46,"tag":77,"props":475,"children":476},{"style":161},[477],{"type":51,"value":208},{"type":46,"tag":77,"props":479,"children":480},{"style":155},[481],{"type":51,"value":189},{"type":46,"tag":77,"props":483,"children":484},{"style":90},[485],{"type":51,"value":486},"devtools:customTabs",{"type":46,"tag":77,"props":488,"children":489},{"style":155},[490],{"type":51,"value":189},{"type":46,"tag":77,"props":492,"children":493},{"style":155},[494],{"type":51,"value":256},{"type":46,"tag":77,"props":496,"children":497},{"style":155},[498],{"type":51,"value":499}," (",{"type":46,"tag":77,"props":501,"children":503},{"style":502},"color:#EEFFFF;--shiki-dark:#BABED8;--shiki-light:#90A4AE;font-style:italic;--shiki-dark-font-style:italic;--shiki-light-font-style:italic",[504],{"type":51,"value":505},"tabs",{"type":46,"tag":77,"props":507,"children":508},{"style":155},[509],{"type":51,"value":443},{"type":46,"tag":77,"props":511,"children":513},{"style":512},"color:#C792EA;--shiki-dark:#C792EA;--shiki-light:#9C3EDA",[514],{"type":51,"value":515}," =>",{"type":46,"tag":77,"props":517,"children":518},{"style":155},[519],{"type":51,"value":158},{"type":46,"tag":77,"props":521,"children":522},{"class":79,"line":192},[523,528,532,537,541],{"type":46,"tag":77,"props":524,"children":525},{"style":161},[526],{"type":51,"value":527}," tabs",{"type":46,"tag":77,"props":529,"children":530},{"style":155},[531],{"type":51,"value":468},{"type":46,"tag":77,"props":533,"children":534},{"style":200},[535],{"type":51,"value":536},"push",{"type":46,"tag":77,"props":538,"children":539},{"style":230},[540],{"type":51,"value":208},{"type":46,"tag":77,"props":542,"children":543},{"style":155},[544],{"type":51,"value":213},{"type":46,"tag":77,"props":546,"children":547},{"class":79,"line":196},[548],{"type":46,"tag":77,"props":549,"children":550},{"style":220},[551],{"type":51,"value":552}," // unique identifier",{"type":46,"tag":77,"props":554,"children":555},{"class":79,"line":216},[556,561,565,569,573,577],{"type":46,"tag":77,"props":557,"children":558},{"style":230},[559],{"type":51,"value":560}," name",{"type":46,"tag":77,"props":562,"children":563},{"style":155},[564],{"type":51,"value":238},{"type":46,"tag":77,"props":566,"children":567},{"style":155},[568],{"type":51,"value":179},{"type":46,"tag":77,"props":570,"children":571},{"style":90},[572],{"type":51,"value":247},{"type":46,"tag":77,"props":574,"children":575},{"style":155},[576],{"type":51,"value":189},{"type":46,"tag":77,"props":578,"children":579},{"style":155},[580],{"type":51,"value":256},{"type":46,"tag":77,"props":582,"children":583},{"class":79,"line":226},[584],{"type":46,"tag":77,"props":585,"children":586},{"style":220},[587],{"type":51,"value":588}," // title to display in the tab",{"type":46,"tag":77,"props":590,"children":591},{"class":79,"line":259},[592,597,601,605,609,613],{"type":46,"tag":77,"props":593,"children":594},{"style":230},[595],{"type":51,"value":596}," title",{"type":46,"tag":77,"props":598,"children":599},{"style":155},[600],{"type":51,"value":238},{"type":46,"tag":77,"props":602,"children":603},{"style":155},[604],{"type":51,"value":179},{"type":46,"tag":77,"props":606,"children":607},{"style":90},[608],{"type":51,"value":287},{"type":46,"tag":77,"props":610,"children":611},{"style":155},[612],{"type":51,"value":189},{"type":46,"tag":77,"props":614,"children":615},{"style":155},[616],{"type":51,"value":256},{"type":46,"tag":77,"props":618,"children":619},{"class":79,"line":268},[620],{"type":46,"tag":77,"props":621,"children":622},{"style":220},[623],{"type":51,"value":624}," // any icon from Iconify, or a URL to an image",{"type":46,"tag":77,"props":626,"children":627},{"class":79,"line":298},[628,633,637,641,645,649],{"type":46,"tag":77,"props":629,"children":630},{"style":230},[631],{"type":51,"value":632}," icon",{"type":46,"tag":77,"props":634,"children":635},{"style":155},[636],{"type":51,"value":238},{"type":46,"tag":77,"props":638,"children":639},{"style":155},[640],{"type":51,"value":179},{"type":46,"tag":77,"props":642,"children":643},{"style":90},[644],{"type":51,"value":326},{"type":46,"tag":77,"props":646,"children":647},{"style":155},[648],{"type":51,"value":189},{"type":46,"tag":77,"props":650,"children":651},{"style":155},[652],{"type":51,"value":256},{"type":46,"tag":77,"props":654,"children":655},{"class":79,"line":307},[656],{"type":46,"tag":77,"props":657,"children":658},{"style":220},[659],{"type":51,"value":660}," // iframe view",{"type":46,"tag":77,"props":662,"children":663},{"class":79,"line":337},[664,669,673],{"type":46,"tag":77,"props":665,"children":666},{"style":230},[667],{"type":51,"value":668}," view",{"type":46,"tag":77,"props":670,"children":671},{"style":155},[672],{"type":51,"value":238},{"type":46,"tag":77,"props":674,"children":675},{"style":155},[676],{"type":51,"value":158},{"type":46,"tag":77,"props":678,"children":679},{"class":79,"line":346},[680,685,689,693,697,701],{"type":46,"tag":77,"props":681,"children":682},{"style":230},[683],{"type":51,"value":684}," type",{"type":46,"tag":77,"props":686,"children":687},{"style":155},[688],{"type":51,"value":238},{"type":46,"tag":77,"props":690,"children":691},{"style":155},[692],{"type":51,"value":179},{"type":46,"tag":77,"props":694,"children":695},{"style":90},[696],{"type":51,"value":382},{"type":46,"tag":77,"props":698,"children":699},{"style":155},[700],{"type":51,"value":189},{"type":46,"tag":77,"props":702,"children":703},{"style":155},[704],{"type":51,"value":256},{"type":46,"tag":77,"props":706,"children":707},{"class":79,"line":363},[708,713,717,721,725,729],{"type":46,"tag":77,"props":709,"children":710},{"style":230},[711],{"type":51,"value":712}," src",{"type":46,"tag":77,"props":714,"children":715},{"style":155},[716],{"type":51,"value":238},{"type":46,"tag":77,"props":718,"children":719},{"style":155},[720],{"type":51,"value":179},{"type":46,"tag":77,"props":722,"children":723},{"style":90},[724],{"type":51,"value":412},{"type":46,"tag":77,"props":726,"children":727},{"style":155},[728],{"type":51,"value":189},{"type":46,"tag":77,"props":730,"children":731},{"style":155},[732],{"type":51,"value":256},{"type":46,"tag":77,"props":734,"children":735},{"class":79,"line":393},[736],{"type":46,"tag":77,"props":737,"children":738},{"style":155},[739],{"type":51,"value":740}," },",{"type":46,"tag":77,"props":742,"children":743},{"class":79,"line":423},[744,749],{"type":46,"tag":77,"props":745,"children":746},{"style":155},[747],{"type":51,"value":748}," }",{"type":46,"tag":77,"props":750,"children":751},{"style":230},[752],{"type":51,"value":443},{"type":46,"tag":77,"props":754,"children":755},{"class":79,"line":432},[756,760],{"type":46,"tag":77,"props":757,"children":758},{"style":155},[759],{"type":51,"value":438},{"type":46,"tag":77,"props":761,"children":762},{"style":161},[763],{"type":51,"value":443},{"type":46,"tag":47,"props":765,"children":766},{},[767,769,775],{"type":51,"value":768},"Learn more about ",{"type":46,"tag":770,"props":771,"children":772},"a",{"href":26},[773],{"type":51,"value":774},"DevTools Utility Kit",{"type":51,"value":468},{"type":46,"tag":54,"props":777,"children":779},{"id":778},"lazy-service-launching",[780],{"type":51,"value":781},"Lazy Service Launching",{"type":46,"tag":47,"props":783,"children":784},{},[785],{"type":51,"value":786},"If the view you are contributing is heavy to load, you can have the tab first and let user launch it when they need it.",{"type":46,"tag":66,"props":788,"children":790},{"className":137,"code":789,"language":139,"meta":40,"style":40},"let isReady = false\nconst promise: Promise\u003Cany> | null = null\n\nasync function launchService() {\n // ...launch your service\n isReady = true\n}\n\nnuxt.hook('devtools:customTabs', (tabs) => {\n tabs.push({\n name: 'my-module',\n title: 'My Module',\n view: isReady\n ? {\n type: 'iframe',\n src: '/url-to-your-module-view',\n }\n : {\n type: 'launch',\n description: 'Launch My Module',\n actions: [{\n label: 'Start',\n async handle() {\n if (!promise)\n promise = launchService()\n await promise\n },\n }]\n },\n })\n})\n",[791],{"type":46,"tag":73,"props":792,"children":793},{"__ignoreMap":40},[794,818,874,877,904,912,929,936,939,994,1017,1044,1071,1087,1099,1127,1156,1165,1178,1207,1237,1259,1289,1311,1338,1359,1372,1381,1395,1404,1416],{"type":46,"tag":77,"props":795,"children":796},{"class":79,"line":80},[797,802,807,812],{"type":46,"tag":77,"props":798,"children":799},{"style":512},[800],{"type":51,"value":801},"let",{"type":46,"tag":77,"props":803,"children":804},{"style":161},[805],{"type":51,"value":806}," isReady ",{"type":46,"tag":77,"props":808,"children":809},{"style":155},[810],{"type":51,"value":811},"=",{"type":46,"tag":77,"props":813,"children":815},{"style":814},"color:#FF9CAC;--shiki-dark:#FF9CAC;--shiki-light:#FF5370",[816],{"type":51,"value":817}," false",{"type":46,"tag":77,"props":819,"children":820},{"class":79,"line":192},[821,826,831,835,840,845,850,855,860,865,870],{"type":46,"tag":77,"props":822,"children":823},{"style":512},[824],{"type":51,"value":825},"const",{"type":46,"tag":77,"props":827,"children":828},{"style":161},[829],{"type":51,"value":830}," promise",{"type":46,"tag":77,"props":832,"children":833},{"style":155},[834],{"type":51,"value":238},{"type":46,"tag":77,"props":836,"children":837},{"style":84},[838],{"type":51,"value":839}," Promise",{"type":46,"tag":77,"props":841,"children":842},{"style":155},[843],{"type":51,"value":844},"\u003C",{"type":46,"tag":77,"props":846,"children":847},{"style":84},[848],{"type":51,"value":849},"any",{"type":46,"tag":77,"props":851,"children":852},{"style":155},[853],{"type":51,"value":854},">",{"type":46,"tag":77,"props":856,"children":857},{"style":155},[858],{"type":51,"value":859}," |",{"type":46,"tag":77,"props":861,"children":862},{"style":84},[863],{"type":51,"value":864}," null",{"type":46,"tag":77,"props":866,"children":867},{"style":155},[868],{"type":51,"value":869}," =",{"type":46,"tag":77,"props":871,"children":872},{"style":155},[873],{"type":51,"value":864},{"type":46,"tag":77,"props":875,"children":876},{"class":79,"line":196},[],{"type":46,"tag":77,"props":878,"children":879},{"class":79,"line":216},[880,885,890,895,900],{"type":46,"tag":77,"props":881,"children":882},{"style":512},[883],{"type":51,"value":884},"async",{"type":46,"tag":77,"props":886,"children":887},{"style":512},[888],{"type":51,"value":889}," function",{"type":46,"tag":77,"props":891,"children":892},{"style":200},[893],{"type":51,"value":894}," launchService",{"type":46,"tag":77,"props":896,"children":897},{"style":155},[898],{"type":51,"value":899},"()",{"type":46,"tag":77,"props":901,"children":902},{"style":155},[903],{"type":51,"value":158},{"type":46,"tag":77,"props":905,"children":906},{"class":79,"line":226},[907],{"type":46,"tag":77,"props":908,"children":909},{"style":220},[910],{"type":51,"value":911}," // ...launch your service",{"type":46,"tag":77,"props":913,"children":914},{"class":79,"line":259},[915,920,924],{"type":46,"tag":77,"props":916,"children":917},{"style":161},[918],{"type":51,"value":919}," isReady",{"type":46,"tag":77,"props":921,"children":922},{"style":155},[923],{"type":51,"value":869},{"type":46,"tag":77,"props":925,"children":926},{"style":814},[927],{"type":51,"value":928}," true",{"type":46,"tag":77,"props":930,"children":931},{"class":79,"line":268},[932],{"type":46,"tag":77,"props":933,"children":934},{"style":155},[935],{"type":51,"value":438},{"type":46,"tag":77,"props":937,"children":938},{"class":79,"line":298},[],{"type":46,"tag":77,"props":940,"children":941},{"class":79,"line":307},[942,946,950,954,958,962,966,970,974,978,982,986,990],{"type":46,"tag":77,"props":943,"children":944},{"style":161},[945],{"type":51,"value":463},{"type":46,"tag":77,"props":947,"children":948},{"style":155},[949],{"type":51,"value":468},{"type":46,"tag":77,"props":951,"children":952},{"style":200},[953],{"type":51,"value":473},{"type":46,"tag":77,"props":955,"children":956},{"style":161},[957],{"type":51,"value":208},{"type":46,"tag":77,"props":959,"children":960},{"style":155},[961],{"type":51,"value":189},{"type":46,"tag":77,"props":963,"children":964},{"style":90},[965],{"type":51,"value":486},{"type":46,"tag":77,"props":967,"children":968},{"style":155},[969],{"type":51,"value":189},{"type":46,"tag":77,"props":971,"children":972},{"style":155},[973],{"type":51,"value":256},{"type":46,"tag":77,"props":975,"children":976},{"style":155},[977],{"type":51,"value":499},{"type":46,"tag":77,"props":979,"children":980},{"style":502},[981],{"type":51,"value":505},{"type":46,"tag":77,"props":983,"children":984},{"style":155},[985],{"type":51,"value":443},{"type":46,"tag":77,"props":987,"children":988},{"style":512},[989],{"type":51,"value":515},{"type":46,"tag":77,"props":991,"children":992},{"style":155},[993],{"type":51,"value":158},{"type":46,"tag":77,"props":995,"children":996},{"class":79,"line":337},[997,1001,1005,1009,1013],{"type":46,"tag":77,"props":998,"children":999},{"style":161},[1000],{"type":51,"value":527},{"type":46,"tag":77,"props":1002,"children":1003},{"style":155},[1004],{"type":51,"value":468},{"type":46,"tag":77,"props":1006,"children":1007},{"style":200},[1008],{"type":51,"value":536},{"type":46,"tag":77,"props":1010,"children":1011},{"style":230},[1012],{"type":51,"value":208},{"type":46,"tag":77,"props":1014,"children":1015},{"style":155},[1016],{"type":51,"value":213},{"type":46,"tag":77,"props":1018,"children":1019},{"class":79,"line":346},[1020,1024,1028,1032,1036,1040],{"type":46,"tag":77,"props":1021,"children":1022},{"style":230},[1023],{"type":51,"value":560},{"type":46,"tag":77,"props":1025,"children":1026},{"style":155},[1027],{"type":51,"value":238},{"type":46,"tag":77,"props":1029,"children":1030},{"style":155},[1031],{"type":51,"value":179},{"type":46,"tag":77,"props":1033,"children":1034},{"style":90},[1035],{"type":51,"value":247},{"type":46,"tag":77,"props":1037,"children":1038},{"style":155},[1039],{"type":51,"value":189},{"type":46,"tag":77,"props":1041,"children":1042},{"style":155},[1043],{"type":51,"value":256},{"type":46,"tag":77,"props":1045,"children":1046},{"class":79,"line":363},[1047,1051,1055,1059,1063,1067],{"type":46,"tag":77,"props":1048,"children":1049},{"style":230},[1050],{"type":51,"value":596},{"type":46,"tag":77,"props":1052,"children":1053},{"style":155},[1054],{"type":51,"value":238},{"type":46,"tag":77,"props":1056,"children":1057},{"style":155},[1058],{"type":51,"value":179},{"type":46,"tag":77,"props":1060,"children":1061},{"style":90},[1062],{"type":51,"value":287},{"type":46,"tag":77,"props":1064,"children":1065},{"style":155},[1066],{"type":51,"value":189},{"type":46,"tag":77,"props":1068,"children":1069},{"style":155},[1070],{"type":51,"value":256},{"type":46,"tag":77,"props":1072,"children":1073},{"class":79,"line":393},[1074,1078,1082],{"type":46,"tag":77,"props":1075,"children":1076},{"style":230},[1077],{"type":51,"value":668},{"type":46,"tag":77,"props":1079,"children":1080},{"style":155},[1081],{"type":51,"value":238},{"type":46,"tag":77,"props":1083,"children":1084},{"style":161},[1085],{"type":51,"value":1086}," isReady",{"type":46,"tag":77,"props":1088,"children":1089},{"class":79,"line":423},[1090,1095],{"type":46,"tag":77,"props":1091,"children":1092},{"style":155},[1093],{"type":51,"value":1094}," ?",{"type":46,"tag":77,"props":1096,"children":1097},{"style":155},[1098],{"type":51,"value":158},{"type":46,"tag":77,"props":1100,"children":1101},{"class":79,"line":432},[1102,1107,1111,1115,1119,1123],{"type":46,"tag":77,"props":1103,"children":1104},{"style":230},[1105],{"type":51,"value":1106}," type",{"type":46,"tag":77,"props":1108,"children":1109},{"style":155},[1110],{"type":51,"value":238},{"type":46,"tag":77,"props":1112,"children":1113},{"style":155},[1114],{"type":51,"value":179},{"type":46,"tag":77,"props":1116,"children":1117},{"style":90},[1118],{"type":51,"value":382},{"type":46,"tag":77,"props":1120,"children":1121},{"style":155},[1122],{"type":51,"value":189},{"type":46,"tag":77,"props":1124,"children":1125},{"style":155},[1126],{"type":51,"value":256},{"type":46,"tag":77,"props":1128,"children":1130},{"class":79,"line":1129},16,[1131,1136,1140,1144,1148,1152],{"type":46,"tag":77,"props":1132,"children":1133},{"style":230},[1134],{"type":51,"value":1135}," src",{"type":46,"tag":77,"props":1137,"children":1138},{"style":155},[1139],{"type":51,"value":238},{"type":46,"tag":77,"props":1141,"children":1142},{"style":155},[1143],{"type":51,"value":179},{"type":46,"tag":77,"props":1145,"children":1146},{"style":90},[1147],{"type":51,"value":412},{"type":46,"tag":77,"props":1149,"children":1150},{"style":155},[1151],{"type":51,"value":189},{"type":46,"tag":77,"props":1153,"children":1154},{"style":155},[1155],{"type":51,"value":256},{"type":46,"tag":77,"props":1157,"children":1159},{"class":79,"line":1158},17,[1160],{"type":46,"tag":77,"props":1161,"children":1162},{"style":155},[1163],{"type":51,"value":1164}," }",{"type":46,"tag":77,"props":1166,"children":1168},{"class":79,"line":1167},18,[1169,1174],{"type":46,"tag":77,"props":1170,"children":1171},{"style":155},[1172],{"type":51,"value":1173}," :",{"type":46,"tag":77,"props":1175,"children":1176},{"style":155},[1177],{"type":51,"value":158},{"type":46,"tag":77,"props":1179,"children":1181},{"class":79,"line":1180},19,[1182,1186,1190,1194,1199,1203],{"type":46,"tag":77,"props":1183,"children":1184},{"style":230},[1185],{"type":51,"value":1106},{"type":46,"tag":77,"props":1187,"children":1188},{"style":155},[1189],{"type":51,"value":238},{"type":46,"tag":77,"props":1191,"children":1192},{"style":155},[1193],{"type":51,"value":179},{"type":46,"tag":77,"props":1195,"children":1196},{"style":90},[1197],{"type":51,"value":1198},"launch",{"type":46,"tag":77,"props":1200,"children":1201},{"style":155},[1202],{"type":51,"value":189},{"type":46,"tag":77,"props":1204,"children":1205},{"style":155},[1206],{"type":51,"value":256},{"type":46,"tag":77,"props":1208,"children":1210},{"class":79,"line":1209},20,[1211,1216,1220,1224,1229,1233],{"type":46,"tag":77,"props":1212,"children":1213},{"style":230},[1214],{"type":51,"value":1215}," description",{"type":46,"tag":77,"props":1217,"children":1218},{"style":155},[1219],{"type":51,"value":238},{"type":46,"tag":77,"props":1221,"children":1222},{"style":155},[1223],{"type":51,"value":179},{"type":46,"tag":77,"props":1225,"children":1226},{"style":90},[1227],{"type":51,"value":1228},"Launch My Module",{"type":46,"tag":77,"props":1230,"children":1231},{"style":155},[1232],{"type":51,"value":189},{"type":46,"tag":77,"props":1234,"children":1235},{"style":155},[1236],{"type":51,"value":256},{"type":46,"tag":77,"props":1238,"children":1240},{"class":79,"line":1239},21,[1241,1246,1250,1255],{"type":46,"tag":77,"props":1242,"children":1243},{"style":230},[1244],{"type":51,"value":1245}," actions",{"type":46,"tag":77,"props":1247,"children":1248},{"style":155},[1249],{"type":51,"value":238},{"type":46,"tag":77,"props":1251,"children":1252},{"style":230},[1253],{"type":51,"value":1254}," [",{"type":46,"tag":77,"props":1256,"children":1257},{"style":155},[1258],{"type":51,"value":213},{"type":46,"tag":77,"props":1260,"children":1262},{"class":79,"line":1261},22,[1263,1268,1272,1276,1281,1285],{"type":46,"tag":77,"props":1264,"children":1265},{"style":230},[1266],{"type":51,"value":1267}," label",{"type":46,"tag":77,"props":1269,"children":1270},{"style":155},[1271],{"type":51,"value":238},{"type":46,"tag":77,"props":1273,"children":1274},{"style":155},[1275],{"type":51,"value":179},{"type":46,"tag":77,"props":1277,"children":1278},{"style":90},[1279],{"type":51,"value":1280},"Start",{"type":46,"tag":77,"props":1282,"children":1283},{"style":155},[1284],{"type":51,"value":189},{"type":46,"tag":77,"props":1286,"children":1287},{"style":155},[1288],{"type":51,"value":256},{"type":46,"tag":77,"props":1290,"children":1292},{"class":79,"line":1291},23,[1293,1298,1303,1307],{"type":46,"tag":77,"props":1294,"children":1295},{"style":512},[1296],{"type":51,"value":1297}," async",{"type":46,"tag":77,"props":1299,"children":1300},{"style":230},[1301],{"type":51,"value":1302}," handle",{"type":46,"tag":77,"props":1304,"children":1305},{"style":155},[1306],{"type":51,"value":899},{"type":46,"tag":77,"props":1308,"children":1309},{"style":155},[1310],{"type":51,"value":158},{"type":46,"tag":77,"props":1312,"children":1314},{"class":79,"line":1313},24,[1315,1320,1324,1329,1334],{"type":46,"tag":77,"props":1316,"children":1317},{"style":149},[1318],{"type":51,"value":1319}," if",{"type":46,"tag":77,"props":1321,"children":1322},{"style":230},[1323],{"type":51,"value":499},{"type":46,"tag":77,"props":1325,"children":1326},{"style":155},[1327],{"type":51,"value":1328},"!",{"type":46,"tag":77,"props":1330,"children":1331},{"style":161},[1332],{"type":51,"value":1333},"promise",{"type":46,"tag":77,"props":1335,"children":1336},{"style":230},[1337],{"type":51,"value":443},{"type":46,"tag":77,"props":1339,"children":1341},{"class":79,"line":1340},25,[1342,1347,1351,1355],{"type":46,"tag":77,"props":1343,"children":1344},{"style":161},[1345],{"type":51,"value":1346}," promise",{"type":46,"tag":77,"props":1348,"children":1349},{"style":155},[1350],{"type":51,"value":869},{"type":46,"tag":77,"props":1352,"children":1353},{"style":200},[1354],{"type":51,"value":894},{"type":46,"tag":77,"props":1356,"children":1357},{"style":230},[1358],{"type":51,"value":899},{"type":46,"tag":77,"props":1360,"children":1362},{"class":79,"line":1361},26,[1363,1368],{"type":46,"tag":77,"props":1364,"children":1365},{"style":149},[1366],{"type":51,"value":1367}," await",{"type":46,"tag":77,"props":1369,"children":1370},{"style":161},[1371],{"type":51,"value":830},{"type":46,"tag":77,"props":1373,"children":1375},{"class":79,"line":1374},27,[1376],{"type":46,"tag":77,"props":1377,"children":1378},{"style":155},[1379],{"type":51,"value":1380}," },",{"type":46,"tag":77,"props":1382,"children":1384},{"class":79,"line":1383},28,[1385,1390],{"type":46,"tag":77,"props":1386,"children":1387},{"style":155},[1388],{"type":51,"value":1389}," }",{"type":46,"tag":77,"props":1391,"children":1392},{"style":230},[1393],{"type":51,"value":1394},"]",{"type":46,"tag":77,"props":1396,"children":1398},{"class":79,"line":1397},29,[1399],{"type":46,"tag":77,"props":1400,"children":1401},{"style":155},[1402],{"type":51,"value":1403}," },",{"type":46,"tag":77,"props":1405,"children":1407},{"class":79,"line":1406},30,[1408,1412],{"type":46,"tag":77,"props":1409,"children":1410},{"style":155},[1411],{"type":51,"value":748},{"type":46,"tag":77,"props":1413,"children":1414},{"style":230},[1415],{"type":51,"value":443},{"type":46,"tag":77,"props":1417,"children":1419},{"class":79,"line":1418},31,[1420,1424],{"type":46,"tag":77,"props":1421,"children":1422},{"style":155},[1423],{"type":51,"value":438},{"type":46,"tag":77,"props":1425,"children":1426},{"style":161},[1427],{"type":51,"value":443},{"type":46,"tag":47,"props":1429,"children":1430},{},[1431,1433,1438],{"type":51,"value":1432},"It will first display a launch page with a button to start the service. When user click the button, the ",{"type":46,"tag":73,"props":1434,"children":1435},{"className":40},[1436],{"type":51,"value":1437},"handle()",{"type":51,"value":1439}," will be called, and the view will be updated to iframe.",{"type":46,"tag":47,"props":1441,"children":1442},{},[1443,1445,1450,1452,1456],{"type":51,"value":1444},"When you need to refresh the custom tabs, you can call ",{"type":46,"tag":73,"props":1446,"children":1447},{"className":40},[1448],{"type":51,"value":1449},"nuxt.callHook('devtools:customTabs:refresh')",{"type":51,"value":1451}," and the hooks on ",{"type":46,"tag":73,"props":1453,"children":1454},{"className":40},[1455],{"type":51,"value":486},{"type":51,"value":1457}," will be revaluated again.",{"type":46,"tag":54,"props":1459,"children":1461},{"id":1460},"api-for-custom-view",[1462],{"type":51,"value":1463},"API for Custom View",{"type":46,"tag":47,"props":1465,"children":1466},{},[1467,1469,1475],{"type":51,"value":1468},"Please refer to ",{"type":46,"tag":770,"props":1470,"children":1472},{"href":1471},"/module/utils-kit#nuxtdevtools-kitiframe-client",[1473],{"type":51,"value":1474},"Iframe Client",{"type":51,"value":468},{"type":46,"tag":54,"props":1477,"children":1479},{"id":1478},"custom-rpc-functions",[1480],{"type":51,"value":1481},"Custom RPC Functions",{"type":46,"tag":47,"props":1483,"children":1484},{},[1485],{"type":51,"value":1486},"Nuxt DevTools uses Remote Procedure Call (RPC) to communicate between the server and client. For modules you can also leverage that to communicate your server code.",{"type":46,"tag":47,"props":1488,"children":1489},{},[1490],{"type":51,"value":1491},"To do that, we recommend to define your types in a shared TypeScript file first:",{"type":46,"tag":66,"props":1493,"children":1495},{"className":137,"code":1494,"language":139,"meta":40,"style":40},"// rpc-types.ts\n\nexport interface ServerFunctions {\n getMyModuleOptions(): MyModuleOptions\n}\n\nexport interface ClientFunctions {\n showNotification(message: string): void\n}\n",[1496],{"type":46,"tag":73,"props":1497,"children":1498},{"__ignoreMap":40},[1499,1507,1510,1532,1550,1557,1560,1580,1616],{"type":46,"tag":77,"props":1500,"children":1501},{"class":79,"line":80},[1502],{"type":46,"tag":77,"props":1503,"children":1504},{"style":220},[1505],{"type":51,"value":1506},"// rpc-types.ts",{"type":46,"tag":77,"props":1508,"children":1509},{"class":79,"line":192},[],{"type":46,"tag":77,"props":1511,"children":1512},{"class":79,"line":196},[1513,1518,1523,1528],{"type":46,"tag":77,"props":1514,"children":1515},{"style":149},[1516],{"type":51,"value":1517},"export",{"type":46,"tag":77,"props":1519,"children":1520},{"style":512},[1521],{"type":51,"value":1522}," interface",{"type":46,"tag":77,"props":1524,"children":1525},{"style":84},[1526],{"type":51,"value":1527}," ServerFunctions",{"type":46,"tag":77,"props":1529,"children":1530},{"style":155},[1531],{"type":51,"value":158},{"type":46,"tag":77,"props":1533,"children":1534},{"class":79,"line":216},[1535,1540,1545],{"type":46,"tag":77,"props":1536,"children":1537},{"style":230},[1538],{"type":51,"value":1539}," getMyModuleOptions",{"type":46,"tag":77,"props":1541,"children":1542},{"style":155},[1543],{"type":51,"value":1544},"():",{"type":46,"tag":77,"props":1546,"children":1547},{"style":84},[1548],{"type":51,"value":1549}," MyModuleOptions",{"type":46,"tag":77,"props":1551,"children":1552},{"class":79,"line":226},[1553],{"type":46,"tag":77,"props":1554,"children":1555},{"style":155},[1556],{"type":51,"value":438},{"type":46,"tag":77,"props":1558,"children":1559},{"class":79,"line":259},[],{"type":46,"tag":77,"props":1561,"children":1562},{"class":79,"line":268},[1563,1567,1571,1576],{"type":46,"tag":77,"props":1564,"children":1565},{"style":149},[1566],{"type":51,"value":1517},{"type":46,"tag":77,"props":1568,"children":1569},{"style":512},[1570],{"type":51,"value":1522},{"type":46,"tag":77,"props":1572,"children":1573},{"style":84},[1574],{"type":51,"value":1575}," ClientFunctions",{"type":46,"tag":77,"props":1577,"children":1578},{"style":155},[1579],{"type":51,"value":158},{"type":46,"tag":77,"props":1581,"children":1582},{"class":79,"line":298},[1583,1588,1592,1597,1601,1606,1611],{"type":46,"tag":77,"props":1584,"children":1585},{"style":230},[1586],{"type":51,"value":1587}," showNotification",{"type":46,"tag":77,"props":1589,"children":1590},{"style":155},[1591],{"type":51,"value":208},{"type":46,"tag":77,"props":1593,"children":1594},{"style":502},[1595],{"type":51,"value":1596},"message",{"type":46,"tag":77,"props":1598,"children":1599},{"style":155},[1600],{"type":51,"value":238},{"type":46,"tag":77,"props":1602,"children":1603},{"style":84},[1604],{"type":51,"value":1605}," string",{"type":46,"tag":77,"props":1607,"children":1608},{"style":155},[1609],{"type":51,"value":1610},"):",{"type":46,"tag":77,"props":1612,"children":1613},{"style":84},[1614],{"type":51,"value":1615}," void",{"type":46,"tag":77,"props":1617,"children":1618},{"class":79,"line":307},[1619],{"type":46,"tag":77,"props":1620,"children":1621},{"style":155},[1622],{"type":51,"value":438},{"type":46,"tag":47,"props":1624,"children":1625},{},[1626],{"type":51,"value":1627},"And then in your module code:",{"type":46,"tag":66,"props":1629,"children":1631},{"className":137,"code":1630,"language":139,"meta":40,"style":40},"import { defineNuxtModule } from '@nuxt/kit'\nimport { extendServerRpc, onDevToolsInitialized } from '@nuxt/devtools-kit'\nimport type { ClientFunctions, ServerFunctions } from './rpc-types'\n\nconst RPC_NAMESPACE = 'my-module-rpc'\n\nexport default defineNuxtModule({\n setup(options, nuxt) {\n // wait for DevTools to be initialized\n onDevToolsInitialized(async () => {\n const rpc = extendServerRpc\u003CClientFunctions, ServerFunctions>(RPC_NAMESPACE, {\n // register server RPC functions\n getMyModuleOptions() {\n return options\n },\n })\n\n // call client RPC functions\n // since it might have multiple clients connected, we use `broadcast` to call all of them\n await rpc.broadcast.showNotification('Hello from My Module!')\n })\n }\n})\n",[1632],{"type":46,"tag":73,"props":1633,"children":1634},{"__ignoreMap":40},[1635,1672,1717,1766,1769,1798,1801,1825,1859,1867,1896,1955,1963,1979,1992,1999,2011,2014,2022,2030,2081,2093,2100],{"type":46,"tag":77,"props":1636,"children":1637},{"class":79,"line":80},[1638,1642,1646,1651,1655,1659,1663,1668],{"type":46,"tag":77,"props":1639,"children":1640},{"style":149},[1641],{"type":51,"value":152},{"type":46,"tag":77,"props":1643,"children":1644},{"style":155},[1645],{"type":51,"value":158},{"type":46,"tag":77,"props":1647,"children":1648},{"style":161},[1649],{"type":51,"value":1650}," defineNuxtModule",{"type":46,"tag":77,"props":1652,"children":1653},{"style":155},[1654],{"type":51,"value":169},{"type":46,"tag":77,"props":1656,"children":1657},{"style":149},[1658],{"type":51,"value":174},{"type":46,"tag":77,"props":1660,"children":1661},{"style":155},[1662],{"type":51,"value":179},{"type":46,"tag":77,"props":1664,"children":1665},{"style":90},[1666],{"type":51,"value":1667},"@nuxt/kit",{"type":46,"tag":77,"props":1669,"children":1670},{"style":155},[1671],{"type":51,"value":189},{"type":46,"tag":77,"props":1673,"children":1674},{"class":79,"line":192},[1675,1679,1683,1688,1692,1697,1701,1705,1709,1713],{"type":46,"tag":77,"props":1676,"children":1677},{"style":149},[1678],{"type":51,"value":152},{"type":46,"tag":77,"props":1680,"children":1681},{"style":155},[1682],{"type":51,"value":158},{"type":46,"tag":77,"props":1684,"children":1685},{"style":161},[1686],{"type":51,"value":1687}," extendServerRpc",{"type":46,"tag":77,"props":1689,"children":1690},{"style":155},[1691],{"type":51,"value":256},{"type":46,"tag":77,"props":1693,"children":1694},{"style":161},[1695],{"type":51,"value":1696}," onDevToolsInitialized",{"type":46,"tag":77,"props":1698,"children":1699},{"style":155},[1700],{"type":51,"value":169},{"type":46,"tag":77,"props":1702,"children":1703},{"style":149},[1704],{"type":51,"value":174},{"type":46,"tag":77,"props":1706,"children":1707},{"style":155},[1708],{"type":51,"value":179},{"type":46,"tag":77,"props":1710,"children":1711},{"style":90},[1712],{"type":51,"value":184},{"type":46,"tag":77,"props":1714,"children":1715},{"style":155},[1716],{"type":51,"value":189},{"type":46,"tag":77,"props":1718,"children":1719},{"class":79,"line":196},[1720,1724,1729,1733,1737,1741,1745,1749,1753,1757,1762],{"type":46,"tag":77,"props":1721,"children":1722},{"style":149},[1723],{"type":51,"value":152},{"type":46,"tag":77,"props":1725,"children":1726},{"style":149},[1727],{"type":51,"value":1728}," type",{"type":46,"tag":77,"props":1730,"children":1731},{"style":155},[1732],{"type":51,"value":158},{"type":46,"tag":77,"props":1734,"children":1735},{"style":161},[1736],{"type":51,"value":1575},{"type":46,"tag":77,"props":1738,"children":1739},{"style":155},[1740],{"type":51,"value":256},{"type":46,"tag":77,"props":1742,"children":1743},{"style":161},[1744],{"type":51,"value":1527},{"type":46,"tag":77,"props":1746,"children":1747},{"style":155},[1748],{"type":51,"value":169},{"type":46,"tag":77,"props":1750,"children":1751},{"style":149},[1752],{"type":51,"value":174},{"type":46,"tag":77,"props":1754,"children":1755},{"style":155},[1756],{"type":51,"value":179},{"type":46,"tag":77,"props":1758,"children":1759},{"style":90},[1760],{"type":51,"value":1761},"./rpc-types",{"type":46,"tag":77,"props":1763,"children":1764},{"style":155},[1765],{"type":51,"value":189},{"type":46,"tag":77,"props":1767,"children":1768},{"class":79,"line":216},[],{"type":46,"tag":77,"props":1770,"children":1771},{"class":79,"line":226},[1772,1776,1781,1785,1789,1794],{"type":46,"tag":77,"props":1773,"children":1774},{"style":512},[1775],{"type":51,"value":825},{"type":46,"tag":77,"props":1777,"children":1778},{"style":161},[1779],{"type":51,"value":1780}," RPC_NAMESPACE ",{"type":46,"tag":77,"props":1782,"children":1783},{"style":155},[1784],{"type":51,"value":811},{"type":46,"tag":77,"props":1786,"children":1787},{"style":155},[1788],{"type":51,"value":179},{"type":46,"tag":77,"props":1790,"children":1791},{"style":90},[1792],{"type":51,"value":1793},"my-module-rpc",{"type":46,"tag":77,"props":1795,"children":1796},{"style":155},[1797],{"type":51,"value":189},{"type":46,"tag":77,"props":1799,"children":1800},{"class":79,"line":259},[],{"type":46,"tag":77,"props":1802,"children":1803},{"class":79,"line":268},[1804,1808,1813,1817,1821],{"type":46,"tag":77,"props":1805,"children":1806},{"style":149},[1807],{"type":51,"value":1517},{"type":46,"tag":77,"props":1809,"children":1810},{"style":149},[1811],{"type":51,"value":1812}," default",{"type":46,"tag":77,"props":1814,"children":1815},{"style":200},[1816],{"type":51,"value":1650},{"type":46,"tag":77,"props":1818,"children":1819},{"style":161},[1820],{"type":51,"value":208},{"type":46,"tag":77,"props":1822,"children":1823},{"style":155},[1824],{"type":51,"value":213},{"type":46,"tag":77,"props":1826,"children":1827},{"class":79,"line":298},[1828,1833,1837,1842,1846,1851,1855],{"type":46,"tag":77,"props":1829,"children":1830},{"style":230},[1831],{"type":51,"value":1832}," setup",{"type":46,"tag":77,"props":1834,"children":1835},{"style":155},[1836],{"type":51,"value":208},{"type":46,"tag":77,"props":1838,"children":1839},{"style":502},[1840],{"type":51,"value":1841},"options",{"type":46,"tag":77,"props":1843,"children":1844},{"style":155},[1845],{"type":51,"value":256},{"type":46,"tag":77,"props":1847,"children":1848},{"style":502},[1849],{"type":51,"value":1850}," nuxt",{"type":46,"tag":77,"props":1852,"children":1853},{"style":155},[1854],{"type":51,"value":443},{"type":46,"tag":77,"props":1856,"children":1857},{"style":155},[1858],{"type":51,"value":158},{"type":46,"tag":77,"props":1860,"children":1861},{"class":79,"line":307},[1862],{"type":46,"tag":77,"props":1863,"children":1864},{"style":220},[1865],{"type":51,"value":1866}," // wait for DevTools to be initialized",{"type":46,"tag":77,"props":1868,"children":1869},{"class":79,"line":337},[1870,1875,1879,1883,1888,1892],{"type":46,"tag":77,"props":1871,"children":1872},{"style":200},[1873],{"type":51,"value":1874}," onDevToolsInitialized",{"type":46,"tag":77,"props":1876,"children":1877},{"style":230},[1878],{"type":51,"value":208},{"type":46,"tag":77,"props":1880,"children":1881},{"style":512},[1882],{"type":51,"value":884},{"type":46,"tag":77,"props":1884,"children":1885},{"style":155},[1886],{"type":51,"value":1887}," ()",{"type":46,"tag":77,"props":1889,"children":1890},{"style":512},[1891],{"type":51,"value":515},{"type":46,"tag":77,"props":1893,"children":1894},{"style":155},[1895],{"type":51,"value":158},{"type":46,"tag":77,"props":1897,"children":1898},{"class":79,"line":346},[1899,1904,1909,1913,1917,1921,1926,1930,1934,1938,1942,1947,1951],{"type":46,"tag":77,"props":1900,"children":1901},{"style":512},[1902],{"type":51,"value":1903}," const",{"type":46,"tag":77,"props":1905,"children":1906},{"style":161},[1907],{"type":51,"value":1908}," rpc",{"type":46,"tag":77,"props":1910,"children":1911},{"style":155},[1912],{"type":51,"value":869},{"type":46,"tag":77,"props":1914,"children":1915},{"style":200},[1916],{"type":51,"value":1687},{"type":46,"tag":77,"props":1918,"children":1919},{"style":155},[1920],{"type":51,"value":844},{"type":46,"tag":77,"props":1922,"children":1923},{"style":84},[1924],{"type":51,"value":1925},"ClientFunctions",{"type":46,"tag":77,"props":1927,"children":1928},{"style":155},[1929],{"type":51,"value":256},{"type":46,"tag":77,"props":1931,"children":1932},{"style":84},[1933],{"type":51,"value":1527},{"type":46,"tag":77,"props":1935,"children":1936},{"style":155},[1937],{"type":51,"value":854},{"type":46,"tag":77,"props":1939,"children":1940},{"style":230},[1941],{"type":51,"value":208},{"type":46,"tag":77,"props":1943,"children":1944},{"style":161},[1945],{"type":51,"value":1946},"RPC_NAMESPACE",{"type":46,"tag":77,"props":1948,"children":1949},{"style":155},[1950],{"type":51,"value":256},{"type":46,"tag":77,"props":1952,"children":1953},{"style":155},[1954],{"type":51,"value":158},{"type":46,"tag":77,"props":1956,"children":1957},{"class":79,"line":363},[1958],{"type":46,"tag":77,"props":1959,"children":1960},{"style":220},[1961],{"type":51,"value":1962}," // register server RPC functions",{"type":46,"tag":77,"props":1964,"children":1965},{"class":79,"line":393},[1966,1971,1975],{"type":46,"tag":77,"props":1967,"children":1968},{"style":230},[1969],{"type":51,"value":1970}," getMyModuleOptions",{"type":46,"tag":77,"props":1972,"children":1973},{"style":155},[1974],{"type":51,"value":899},{"type":46,"tag":77,"props":1976,"children":1977},{"style":155},[1978],{"type":51,"value":158},{"type":46,"tag":77,"props":1980,"children":1981},{"class":79,"line":423},[1982,1987],{"type":46,"tag":77,"props":1983,"children":1984},{"style":149},[1985],{"type":51,"value":1986}," return",{"type":46,"tag":77,"props":1988,"children":1989},{"style":161},[1990],{"type":51,"value":1991}," options",{"type":46,"tag":77,"props":1993,"children":1994},{"class":79,"line":432},[1995],{"type":46,"tag":77,"props":1996,"children":1997},{"style":155},[1998],{"type":51,"value":1403},{"type":46,"tag":77,"props":2000,"children":2001},{"class":79,"line":1129},[2002,2007],{"type":46,"tag":77,"props":2003,"children":2004},{"style":155},[2005],{"type":51,"value":2006}," }",{"type":46,"tag":77,"props":2008,"children":2009},{"style":230},[2010],{"type":51,"value":443},{"type":46,"tag":77,"props":2012,"children":2013},{"class":79,"line":1158},[],{"type":46,"tag":77,"props":2015,"children":2016},{"class":79,"line":1167},[2017],{"type":46,"tag":77,"props":2018,"children":2019},{"style":220},[2020],{"type":51,"value":2021}," // call client RPC functions",{"type":46,"tag":77,"props":2023,"children":2024},{"class":79,"line":1180},[2025],{"type":46,"tag":77,"props":2026,"children":2027},{"style":220},[2028],{"type":51,"value":2029}," // since it might have multiple clients connected, we use `broadcast` to call all of them",{"type":46,"tag":77,"props":2031,"children":2032},{"class":79,"line":1209},[2033,2038,2042,2046,2051,2055,2060,2064,2068,2073,2077],{"type":46,"tag":77,"props":2034,"children":2035},{"style":149},[2036],{"type":51,"value":2037}," await",{"type":46,"tag":77,"props":2039,"children":2040},{"style":161},[2041],{"type":51,"value":1908},{"type":46,"tag":77,"props":2043,"children":2044},{"style":155},[2045],{"type":51,"value":468},{"type":46,"tag":77,"props":2047,"children":2048},{"style":161},[2049],{"type":51,"value":2050},"broadcast",{"type":46,"tag":77,"props":2052,"children":2053},{"style":155},[2054],{"type":51,"value":468},{"type":46,"tag":77,"props":2056,"children":2057},{"style":200},[2058],{"type":51,"value":2059},"showNotification",{"type":46,"tag":77,"props":2061,"children":2062},{"style":230},[2063],{"type":51,"value":208},{"type":46,"tag":77,"props":2065,"children":2066},{"style":155},[2067],{"type":51,"value":189},{"type":46,"tag":77,"props":2069,"children":2070},{"style":90},[2071],{"type":51,"value":2072},"Hello from My Module!",{"type":46,"tag":77,"props":2074,"children":2075},{"style":155},[2076],{"type":51,"value":189},{"type":46,"tag":77,"props":2078,"children":2079},{"style":230},[2080],{"type":51,"value":443},{"type":46,"tag":77,"props":2082,"children":2083},{"class":79,"line":1239},[2084,2089],{"type":46,"tag":77,"props":2085,"children":2086},{"style":155},[2087],{"type":51,"value":2088}," }",{"type":46,"tag":77,"props":2090,"children":2091},{"style":230},[2092],{"type":51,"value":443},{"type":46,"tag":77,"props":2094,"children":2095},{"class":79,"line":1261},[2096],{"type":46,"tag":77,"props":2097,"children":2098},{"style":155},[2099],{"type":51,"value":748},{"type":46,"tag":77,"props":2101,"children":2102},{"class":79,"line":1291},[2103,2107],{"type":46,"tag":77,"props":2104,"children":2105},{"style":155},[2106],{"type":51,"value":438},{"type":46,"tag":77,"props":2108,"children":2109},{"style":161},[2110],{"type":51,"value":443},{"type":46,"tag":47,"props":2112,"children":2113},{},[2114],{"type":51,"value":2115},"And on the client side, you can do:",{"type":46,"tag":66,"props":2117,"children":2119},{"className":137,"code":2118,"language":139,"meta":40,"style":40},"import { onDevtoolsClientConnected } from '@nuxt/devtools-kit/iframe-client'\nimport type { ClientFunctions, ServerFunctions } from './rpc-types'\n\nconst RPC_NAMESPACE = 'my-module-rpc'\n\nonDevtoolsClientConnected(async (client) => {\n const rpc = client.devtools.extendClientRpc(RPC_NAMESPACE, {\n showNotification(message) {\n console.log(message)\n },\n })\n\n // call server RPC functions\n const options = await rpc.getMyModuleOptions()\n})\n",[2120],{"type":46,"tag":73,"props":2121,"children":2122},{"__ignoreMap":40},[2123,2160,2207,2210,2237,2240,2277,2332,2356,2385,2392,2403,2406,2414,2451],{"type":46,"tag":77,"props":2124,"children":2125},{"class":79,"line":80},[2126,2130,2134,2139,2143,2147,2151,2156],{"type":46,"tag":77,"props":2127,"children":2128},{"style":149},[2129],{"type":51,"value":152},{"type":46,"tag":77,"props":2131,"children":2132},{"style":155},[2133],{"type":51,"value":158},{"type":46,"tag":77,"props":2135,"children":2136},{"style":161},[2137],{"type":51,"value":2138}," onDevtoolsClientConnected",{"type":46,"tag":77,"props":2140,"children":2141},{"style":155},[2142],{"type":51,"value":169},{"type":46,"tag":77,"props":2144,"children":2145},{"style":149},[2146],{"type":51,"value":174},{"type":46,"tag":77,"props":2148,"children":2149},{"style":155},[2150],{"type":51,"value":179},{"type":46,"tag":77,"props":2152,"children":2153},{"style":90},[2154],{"type":51,"value":2155},"@nuxt/devtools-kit/iframe-client",{"type":46,"tag":77,"props":2157,"children":2158},{"style":155},[2159],{"type":51,"value":189},{"type":46,"tag":77,"props":2161,"children":2162},{"class":79,"line":192},[2163,2167,2171,2175,2179,2183,2187,2191,2195,2199,2203],{"type":46,"tag":77,"props":2164,"children":2165},{"style":149},[2166],{"type":51,"value":152},{"type":46,"tag":77,"props":2168,"children":2169},{"style":149},[2170],{"type":51,"value":1728},{"type":46,"tag":77,"props":2172,"children":2173},{"style":155},[2174],{"type":51,"value":158},{"type":46,"tag":77,"props":2176,"children":2177},{"style":161},[2178],{"type":51,"value":1575},{"type":46,"tag":77,"props":2180,"children":2181},{"style":155},[2182],{"type":51,"value":256},{"type":46,"tag":77,"props":2184,"children":2185},{"style":161},[2186],{"type":51,"value":1527},{"type":46,"tag":77,"props":2188,"children":2189},{"style":155},[2190],{"type":51,"value":169},{"type":46,"tag":77,"props":2192,"children":2193},{"style":149},[2194],{"type":51,"value":174},{"type":46,"tag":77,"props":2196,"children":2197},{"style":155},[2198],{"type":51,"value":179},{"type":46,"tag":77,"props":2200,"children":2201},{"style":90},[2202],{"type":51,"value":1761},{"type":46,"tag":77,"props":2204,"children":2205},{"style":155},[2206],{"type":51,"value":189},{"type":46,"tag":77,"props":2208,"children":2209},{"class":79,"line":196},[],{"type":46,"tag":77,"props":2211,"children":2212},{"class":79,"line":216},[2213,2217,2221,2225,2229,2233],{"type":46,"tag":77,"props":2214,"children":2215},{"style":512},[2216],{"type":51,"value":825},{"type":46,"tag":77,"props":2218,"children":2219},{"style":161},[2220],{"type":51,"value":1780},{"type":46,"tag":77,"props":2222,"children":2223},{"style":155},[2224],{"type":51,"value":811},{"type":46,"tag":77,"props":2226,"children":2227},{"style":155},[2228],{"type":51,"value":179},{"type":46,"tag":77,"props":2230,"children":2231},{"style":90},[2232],{"type":51,"value":1793},{"type":46,"tag":77,"props":2234,"children":2235},{"style":155},[2236],{"type":51,"value":189},{"type":46,"tag":77,"props":2238,"children":2239},{"class":79,"line":226},[],{"type":46,"tag":77,"props":2241,"children":2242},{"class":79,"line":259},[2243,2248,2252,2256,2260,2265,2269,2273],{"type":46,"tag":77,"props":2244,"children":2245},{"style":200},[2246],{"type":51,"value":2247},"onDevtoolsClientConnected",{"type":46,"tag":77,"props":2249,"children":2250},{"style":161},[2251],{"type":51,"value":208},{"type":46,"tag":77,"props":2253,"children":2254},{"style":512},[2255],{"type":51,"value":884},{"type":46,"tag":77,"props":2257,"children":2258},{"style":155},[2259],{"type":51,"value":499},{"type":46,"tag":77,"props":2261,"children":2262},{"style":502},[2263],{"type":51,"value":2264},"client",{"type":46,"tag":77,"props":2266,"children":2267},{"style":155},[2268],{"type":51,"value":443},{"type":46,"tag":77,"props":2270,"children":2271},{"style":512},[2272],{"type":51,"value":515},{"type":46,"tag":77,"props":2274,"children":2275},{"style":155},[2276],{"type":51,"value":158},{"type":46,"tag":77,"props":2278,"children":2279},{"class":79,"line":268},[2280,2285,2289,2293,2298,2302,2307,2311,2316,2320,2324,2328],{"type":46,"tag":77,"props":2281,"children":2282},{"style":512},[2283],{"type":51,"value":2284}," const",{"type":46,"tag":77,"props":2286,"children":2287},{"style":161},[2288],{"type":51,"value":1908},{"type":46,"tag":77,"props":2290,"children":2291},{"style":155},[2292],{"type":51,"value":869},{"type":46,"tag":77,"props":2294,"children":2295},{"style":161},[2296],{"type":51,"value":2297}," client",{"type":46,"tag":77,"props":2299,"children":2300},{"style":155},[2301],{"type":51,"value":468},{"type":46,"tag":77,"props":2303,"children":2304},{"style":161},[2305],{"type":51,"value":2306},"devtools",{"type":46,"tag":77,"props":2308,"children":2309},{"style":155},[2310],{"type":51,"value":468},{"type":46,"tag":77,"props":2312,"children":2313},{"style":200},[2314],{"type":51,"value":2315},"extendClientRpc",{"type":46,"tag":77,"props":2317,"children":2318},{"style":230},[2319],{"type":51,"value":208},{"type":46,"tag":77,"props":2321,"children":2322},{"style":161},[2323],{"type":51,"value":1946},{"type":46,"tag":77,"props":2325,"children":2326},{"style":155},[2327],{"type":51,"value":256},{"type":46,"tag":77,"props":2329,"children":2330},{"style":155},[2331],{"type":51,"value":158},{"type":46,"tag":77,"props":2333,"children":2334},{"class":79,"line":298},[2335,2340,2344,2348,2352],{"type":46,"tag":77,"props":2336,"children":2337},{"style":230},[2338],{"type":51,"value":2339}," showNotification",{"type":46,"tag":77,"props":2341,"children":2342},{"style":155},[2343],{"type":51,"value":208},{"type":46,"tag":77,"props":2345,"children":2346},{"style":502},[2347],{"type":51,"value":1596},{"type":46,"tag":77,"props":2349,"children":2350},{"style":155},[2351],{"type":51,"value":443},{"type":46,"tag":77,"props":2353,"children":2354},{"style":155},[2355],{"type":51,"value":158},{"type":46,"tag":77,"props":2357,"children":2358},{"class":79,"line":307},[2359,2364,2368,2373,2377,2381],{"type":46,"tag":77,"props":2360,"children":2361},{"style":161},[2362],{"type":51,"value":2363}," console",{"type":46,"tag":77,"props":2365,"children":2366},{"style":155},[2367],{"type":51,"value":468},{"type":46,"tag":77,"props":2369,"children":2370},{"style":200},[2371],{"type":51,"value":2372},"log",{"type":46,"tag":77,"props":2374,"children":2375},{"style":230},[2376],{"type":51,"value":208},{"type":46,"tag":77,"props":2378,"children":2379},{"style":161},[2380],{"type":51,"value":1596},{"type":46,"tag":77,"props":2382,"children":2383},{"style":230},[2384],{"type":51,"value":443},{"type":46,"tag":77,"props":2386,"children":2387},{"class":79,"line":337},[2388],{"type":46,"tag":77,"props":2389,"children":2390},{"style":155},[2391],{"type":51,"value":740},{"type":46,"tag":77,"props":2393,"children":2394},{"class":79,"line":346},[2395,2399],{"type":46,"tag":77,"props":2396,"children":2397},{"style":155},[2398],{"type":51,"value":748},{"type":46,"tag":77,"props":2400,"children":2401},{"style":230},[2402],{"type":51,"value":443},{"type":46,"tag":77,"props":2404,"children":2405},{"class":79,"line":363},[],{"type":46,"tag":77,"props":2407,"children":2408},{"class":79,"line":393},[2409],{"type":46,"tag":77,"props":2410,"children":2411},{"style":220},[2412],{"type":51,"value":2413}," // call server RPC functions",{"type":46,"tag":77,"props":2415,"children":2416},{"class":79,"line":423},[2417,2421,2425,2429,2434,2438,2442,2447],{"type":46,"tag":77,"props":2418,"children":2419},{"style":512},[2420],{"type":51,"value":2284},{"type":46,"tag":77,"props":2422,"children":2423},{"style":161},[2424],{"type":51,"value":1991},{"type":46,"tag":77,"props":2426,"children":2427},{"style":155},[2428],{"type":51,"value":869},{"type":46,"tag":77,"props":2430,"children":2431},{"style":149},[2432],{"type":51,"value":2433}," await",{"type":46,"tag":77,"props":2435,"children":2436},{"style":161},[2437],{"type":51,"value":1908},{"type":46,"tag":77,"props":2439,"children":2440},{"style":155},[2441],{"type":51,"value":468},{"type":46,"tag":77,"props":2443,"children":2444},{"style":200},[2445],{"type":51,"value":2446},"getMyModuleOptions",{"type":46,"tag":77,"props":2448,"children":2449},{"style":230},[2450],{"type":51,"value":899},{"type":46,"tag":77,"props":2452,"children":2453},{"class":79,"line":432},[2454,2458],{"type":46,"tag":77,"props":2455,"children":2456},{"style":155},[2457],{"type":51,"value":438},{"type":46,"tag":77,"props":2459,"children":2460},{"style":161},[2461],{"type":51,"value":443},{"type":46,"tag":54,"props":2463,"children":2465},{"id":2464},"trying-local-changes",[2466],{"type":51,"value":2467},"Trying Local Changes",{"type":46,"tag":47,"props":2469,"children":2470},{},[2471],{"type":51,"value":2472},"You can clone Nuxt DevTools repo and try your changes locally.",{"type":46,"tag":47,"props":2474,"children":2475},{},[2476,2477,2482],{"type":51,"value":1468},{"type":46,"tag":770,"props":2478,"children":2480},{"href":2479},"/development/contributing#trying-local-changes",[2481],{"type":51,"value":2467},{"type":51,"value":468},{"type":46,"tag":54,"props":2484,"children":2486},{"id":2485},"examples",[2487],{"type":51,"value":2488},"Examples",{"type":46,"tag":47,"props":2490,"children":2491},{},[2492],{"type":51,"value":2493},"Here are a few examples of how to integrate Nuxt DevTools in modules:",{"type":46,"tag":2495,"props":2496,"children":2497},"ul",{},[2498,2510,2520,2530,2540],{"type":46,"tag":2499,"props":2500,"children":2501},"li",{},[2502],{"type":46,"tag":770,"props":2503,"children":2507},{"href":2504,"rel":2505},"https://github.com/nuxt/devtools/blob/main/packages/devtools/src/integrations/vscode.ts",[2506],"nofollow",[2508],{"type":51,"value":2509},"Built-in VS Code integration with lazy initialize",{"type":46,"tag":2499,"props":2511,"children":2512},{},[2513],{"type":46,"tag":770,"props":2514,"children":2517},{"href":2515,"rel":2516},"https://github.com/vueuse/vueuse/blob/ce28cef154489c73abe308104bef8568594a9bcd/packages/nuxt/index.ts#L89-L99",[2506],[2518],{"type":51,"value":2519},"VueUse adds a docs tab",{"type":46,"tag":2499,"props":2521,"children":2522},{},[2523],{"type":46,"tag":770,"props":2524,"children":2527},{"href":2525,"rel":2526},"https://github.com/unocss/unocss/blob/25021a751494e99e85cfd82cca3855cdf78f6a12/packages/nuxt/src/index.ts#L81-L94",[2506],[2528],{"type":51,"value":2529},"UnoCSS Inspector",{"type":46,"tag":2499,"props":2531,"children":2532},{},[2533],{"type":46,"tag":770,"props":2534,"children":2537},{"href":2535,"rel":2536},"https://github.com/danielroe/nuxt-vitest/blob/7bac68d96f27dea6c30c198b7caaaf0b495574ab/packages/nuxt-vitest/src/module.ts#L139-L181",[2506],[2538],{"type":51,"value":2539},"Nuxt Vitest runner",{"type":46,"tag":2499,"props":2541,"children":2542},{},[2543],{"type":46,"tag":770,"props":2544,"children":2547},{"href":2545,"rel":2546},"https://github.com/harlan-zw/nuxt-og-image/blob/main/src/module.ts#L136",[2506],[2548],{"type":51,"value":2549},"Nuxt OG Image Playground",{"type":46,"tag":2551,"props":2552,"children":2553},"style",{},[2554],{"type":51,"value":2555},"html.dark .shiki span {color: var(--shiki-dark) !important;background: var(--shiki-dark-bg) !important;font-style: var(--shiki-dark-font-style) !important;font-weight: var(--shiki-dark-font-weight) !important;text-decoration: var(--shiki-dark-text-decoration) !important;}html.light .shiki span {color: var(--shiki-light) !important;background: var(--shiki-light-bg) !important;font-style: var(--shiki-light-font-style) !important;font-weight: var(--shiki-light-font-weight) !important;text-decoration: var(--shiki-light-text-decoration) !important;}",{"title":40,"searchDepth":192,"depth":192,"links":2557},[2558,2559,2560,2561,2562,2563,2564],{"id":56,"depth":192,"text":59},{"id":121,"depth":192,"text":124},{"id":778,"depth":192,"text":781},{"id":1460,"depth":192,"text":1463},{"id":1478,"depth":192,"text":1481},{"id":2464,"depth":192,"text":2467},{"id":2485,"depth":192,"text":2488},"markdown","content:2.module:0.guide.md","content","2.module/0.guide.md","md",[2571,2872],{"_path":16,"_dir":2572,"_draft":39,"_partial":39,"_locale":40,"title":15,"description":2573,"body":2574,"_type":2565,"_id":2870,"_source":2567,"_file":2871,"_extension":2569},"guide","Open or control Nuxt DevTools with the useNuxtDevtools composable.",{"type":43,"children":2575,"toc":2868},[2576,2588,2811,2816,2859,2864],{"type":46,"tag":47,"props":2577,"children":2578},{},[2579,2581,2586],{"type":51,"value":2580},"In case you might want to open or control the Nuxt DevTools in your application on development, a composable ",{"type":46,"tag":73,"props":2582,"children":2583},{"className":40},[2584],{"type":51,"value":2585},"useNuxtDevtools",{"type":51,"value":2587}," is registered with auto-import.",{"type":46,"tag":66,"props":2589,"children":2593},{"className":2590,"code":2591,"language":2592,"meta":40,"style":40},"language-vue shiki shiki-themes material-theme material-theme-palenight material-theme-lighter","\u003Cscript setup>\n// Returns undefined in production mode or when the DevTools are not enabled\nconst devtoolsClient = useNuxtDevTools() // NuxtDevToolsHostClient | undefined\n\u003C/script>\n\n\u003Ctemplate>\n \u003Cbutton\n v-if=\"devtoolsClient\"\n @click=\"devtoolsClient.devtools.navigate('/modules/components')\"\n >\n \u003C!-- Open the DevTools and navigate to the components tab -->\n Open DevTools\n \u003C/button>\n\u003C/template>\n","vue",[2594],{"type":46,"tag":73,"props":2595,"children":2596},{"__ignoreMap":40},[2597,2618,2626,2657,2673,2676,2692,2705,2731,2756,2764,2772,2780,2796],{"type":46,"tag":77,"props":2598,"children":2599},{"class":79,"line":80},[2600,2604,2609,2614],{"type":46,"tag":77,"props":2601,"children":2602},{"style":155},[2603],{"type":51,"value":844},{"type":46,"tag":77,"props":2605,"children":2606},{"style":230},[2607],{"type":51,"value":2608},"script",{"type":46,"tag":77,"props":2610,"children":2611},{"style":512},[2612],{"type":51,"value":2613}," setup",{"type":46,"tag":77,"props":2615,"children":2616},{"style":155},[2617],{"type":51,"value":854},{"type":46,"tag":77,"props":2619,"children":2620},{"class":79,"line":192},[2621],{"type":46,"tag":77,"props":2622,"children":2623},{"style":220},[2624],{"type":51,"value":2625},"// Returns undefined in production mode or when the DevTools are not enabled",{"type":46,"tag":77,"props":2627,"children":2628},{"class":79,"line":196},[2629,2633,2638,2642,2647,2652],{"type":46,"tag":77,"props":2630,"children":2631},{"style":512},[2632],{"type":51,"value":825},{"type":46,"tag":77,"props":2634,"children":2635},{"style":161},[2636],{"type":51,"value":2637}," devtoolsClient ",{"type":46,"tag":77,"props":2639,"children":2640},{"style":155},[2641],{"type":51,"value":811},{"type":46,"tag":77,"props":2643,"children":2644},{"style":200},[2645],{"type":51,"value":2646}," useNuxtDevTools",{"type":46,"tag":77,"props":2648,"children":2649},{"style":161},[2650],{"type":51,"value":2651},"() ",{"type":46,"tag":77,"props":2653,"children":2654},{"style":220},[2655],{"type":51,"value":2656},"// NuxtDevToolsHostClient | undefined",{"type":46,"tag":77,"props":2658,"children":2659},{"class":79,"line":216},[2660,2665,2669],{"type":46,"tag":77,"props":2661,"children":2662},{"style":155},[2663],{"type":51,"value":2664},"\u003C/",{"type":46,"tag":77,"props":2666,"children":2667},{"style":230},[2668],{"type":51,"value":2608},{"type":46,"tag":77,"props":2670,"children":2671},{"style":155},[2672],{"type":51,"value":854},{"type":46,"tag":77,"props":2674,"children":2675},{"class":79,"line":226},[],{"type":46,"tag":77,"props":2677,"children":2678},{"class":79,"line":259},[2679,2683,2688],{"type":46,"tag":77,"props":2680,"children":2681},{"style":155},[2682],{"type":51,"value":844},{"type":46,"tag":77,"props":2684,"children":2685},{"style":230},[2686],{"type":51,"value":2687},"template",{"type":46,"tag":77,"props":2689,"children":2690},{"style":155},[2691],{"type":51,"value":854},{"type":46,"tag":77,"props":2693,"children":2694},{"class":79,"line":268},[2695,2700],{"type":46,"tag":77,"props":2696,"children":2697},{"style":155},[2698],{"type":51,"value":2699}," \u003C",{"type":46,"tag":77,"props":2701,"children":2702},{"style":230},[2703],{"type":51,"value":2704},"button",{"type":46,"tag":77,"props":2706,"children":2707},{"class":79,"line":298},[2708,2713,2717,2722,2727],{"type":46,"tag":77,"props":2709,"children":2710},{"style":512},[2711],{"type":51,"value":2712}," v-if",{"type":46,"tag":77,"props":2714,"children":2715},{"style":155},[2716],{"type":51,"value":811},{"type":46,"tag":77,"props":2718,"children":2719},{"style":155},[2720],{"type":51,"value":2721},"\"",{"type":46,"tag":77,"props":2723,"children":2724},{"style":90},[2725],{"type":51,"value":2726},"devtoolsClient",{"type":46,"tag":77,"props":2728,"children":2729},{"style":155},[2730],{"type":51,"value":2721},{"type":46,"tag":77,"props":2732,"children":2733},{"class":79,"line":307},[2734,2739,2743,2747,2752],{"type":46,"tag":77,"props":2735,"children":2736},{"style":512},[2737],{"type":51,"value":2738}," @click",{"type":46,"tag":77,"props":2740,"children":2741},{"style":155},[2742],{"type":51,"value":811},{"type":46,"tag":77,"props":2744,"children":2745},{"style":155},[2746],{"type":51,"value":2721},{"type":46,"tag":77,"props":2748,"children":2749},{"style":90},[2750],{"type":51,"value":2751},"devtoolsClient.devtools.navigate('/modules/components')",{"type":46,"tag":77,"props":2753,"children":2754},{"style":155},[2755],{"type":51,"value":2721},{"type":46,"tag":77,"props":2757,"children":2758},{"class":79,"line":337},[2759],{"type":46,"tag":77,"props":2760,"children":2761},{"style":155},[2762],{"type":51,"value":2763}," >",{"type":46,"tag":77,"props":2765,"children":2766},{"class":79,"line":346},[2767],{"type":46,"tag":77,"props":2768,"children":2769},{"style":220},[2770],{"type":51,"value":2771}," \u003C!-- Open the DevTools and navigate to the components tab -->",{"type":46,"tag":77,"props":2773,"children":2774},{"class":79,"line":363},[2775],{"type":46,"tag":77,"props":2776,"children":2777},{"style":161},[2778],{"type":51,"value":2779}," Open DevTools",{"type":46,"tag":77,"props":2781,"children":2782},{"class":79,"line":393},[2783,2788,2792],{"type":46,"tag":77,"props":2784,"children":2785},{"style":155},[2786],{"type":51,"value":2787}," \u003C/",{"type":46,"tag":77,"props":2789,"children":2790},{"style":230},[2791],{"type":51,"value":2704},{"type":46,"tag":77,"props":2793,"children":2794},{"style":155},[2795],{"type":51,"value":854},{"type":46,"tag":77,"props":2797,"children":2798},{"class":79,"line":423},[2799,2803,2807],{"type":46,"tag":77,"props":2800,"children":2801},{"style":155},[2802],{"type":51,"value":2664},{"type":46,"tag":77,"props":2804,"children":2805},{"style":230},[2806],{"type":51,"value":2687},{"type":46,"tag":77,"props":2808,"children":2809},{"style":155},[2810],{"type":51,"value":854},{"type":46,"tag":47,"props":2812,"children":2813},{},[2814],{"type":51,"value":2815},"When you have auto-import disabled, you can also import it explicitly:",{"type":46,"tag":66,"props":2817,"children":2819},{"className":137,"code":2818,"language":139,"meta":40,"style":40},"import { useNuxtDevTools } from '#imports'\n",[2820],{"type":46,"tag":73,"props":2821,"children":2822},{"__ignoreMap":40},[2823],{"type":46,"tag":77,"props":2824,"children":2825},{"class":79,"line":80},[2826,2830,2834,2838,2842,2846,2850,2855],{"type":46,"tag":77,"props":2827,"children":2828},{"style":149},[2829],{"type":51,"value":152},{"type":46,"tag":77,"props":2831,"children":2832},{"style":155},[2833],{"type":51,"value":158},{"type":46,"tag":77,"props":2835,"children":2836},{"style":161},[2837],{"type":51,"value":2646},{"type":46,"tag":77,"props":2839,"children":2840},{"style":155},[2841],{"type":51,"value":169},{"type":46,"tag":77,"props":2843,"children":2844},{"style":149},[2845],{"type":51,"value":174},{"type":46,"tag":77,"props":2847,"children":2848},{"style":155},[2849],{"type":51,"value":179},{"type":46,"tag":77,"props":2851,"children":2852},{"style":90},[2853],{"type":51,"value":2854},"#imports",{"type":46,"tag":77,"props":2856,"children":2857},{"style":155},[2858],{"type":51,"value":189},{"type":46,"tag":47,"props":2860,"children":2861},{},[2862],{"type":51,"value":2863},"Checkout it's type definition for more available methods.",{"type":46,"tag":2551,"props":2865,"children":2866},{},[2867],{"type":51,"value":2555},{"title":40,"searchDepth":192,"depth":192,"links":2869},[],"content:1.guide:2.composables.md","1.guide/2.composables.md",{"_path":26,"_dir":38,"_draft":39,"_partial":39,"_locale":40,"title":25,"description":2873,"body":2874,"_type":2565,"_id":4359,"_source":2567,"_file":4360,"_extension":2569},"Utility kit for easier DevTools integrations.",{"type":43,"children":2875,"toc":4347},[2876,2886,2911,2953,2971,2979,2989,2999,3268,3277,3289,3298,3310,3651,3699,3708,3713,3862,3873,3881,3886,3891,3965,3984,3992,4011,4020,4042,4051,4056,4163,4172,4183,4343],{"type":46,"tag":47,"props":2877,"children":2878},{},[2879,2881,2885],{"type":51,"value":2880},"Since v0.3.0, we are now providing a utility kit for easier DevTools integrations, similar to ",{"type":46,"tag":73,"props":2882,"children":2883},{"className":40},[2884],{"type":51,"value":1667},{"type":51,"value":468},{"type":46,"tag":66,"props":2887,"children":2889},{"className":68,"code":2888,"language":70,"meta":40,"style":40},"npm i @nuxt/devtools-kit\n",[2890],{"type":46,"tag":73,"props":2891,"children":2892},{"__ignoreMap":40},[2893],{"type":46,"tag":77,"props":2894,"children":2895},{"class":79,"line":80},[2896,2901,2906],{"type":46,"tag":77,"props":2897,"children":2898},{"style":84},[2899],{"type":51,"value":2900},"npm",{"type":46,"tag":77,"props":2902,"children":2903},{"style":90},[2904],{"type":51,"value":2905}," i",{"type":46,"tag":77,"props":2907,"children":2908},{"style":90},[2909],{"type":51,"value":2910}," @nuxt/devtools-kit",{"type":46,"tag":66,"props":2912,"children":2914},{"className":137,"code":2913,"language":139,"meta":40,"style":40},"import { addCustomTab } from '@nuxt/devtools-kit'\n",[2915],{"type":46,"tag":73,"props":2916,"children":2917},{"__ignoreMap":40},[2918],{"type":46,"tag":77,"props":2919,"children":2920},{"class":79,"line":80},[2921,2925,2929,2933,2937,2941,2945,2949],{"type":46,"tag":77,"props":2922,"children":2923},{"style":149},[2924],{"type":51,"value":152},{"type":46,"tag":77,"props":2926,"children":2927},{"style":155},[2928],{"type":51,"value":158},{"type":46,"tag":77,"props":2930,"children":2931},{"style":161},[2932],{"type":51,"value":164},{"type":46,"tag":77,"props":2934,"children":2935},{"style":155},[2936],{"type":51,"value":169},{"type":46,"tag":77,"props":2938,"children":2939},{"style":149},[2940],{"type":51,"value":174},{"type":46,"tag":77,"props":2942,"children":2943},{"style":155},[2944],{"type":51,"value":179},{"type":46,"tag":77,"props":2946,"children":2947},{"style":90},[2948],{"type":51,"value":184},{"type":46,"tag":77,"props":2950,"children":2951},{"style":155},[2952],{"type":51,"value":189},{"type":46,"tag":47,"props":2954,"children":2955},{},[2956,2958,2962,2964,2969],{"type":51,"value":2957},"We recommend module authors to install ",{"type":46,"tag":73,"props":2959,"children":2960},{"className":40},[2961],{"type":51,"value":184},{"type":51,"value":2963}," as a dependency and ",{"type":46,"tag":73,"props":2965,"children":2966},{"className":40},[2967],{"type":51,"value":2968},"@nuxt/devtools",{"type":51,"value":2970}," as a dev dependency.",{"type":46,"tag":54,"props":2972,"children":2974},{"id":2973},"nuxtdevtools-kit",[2975],{"type":46,"tag":73,"props":2976,"children":2977},{"className":40},[2978],{"type":51,"value":184},{"type":46,"tag":2980,"props":2981,"children":2983},"h3",{"id":2982},"addcustomtab",[2984],{"type":46,"tag":73,"props":2985,"children":2986},{"className":40},[2987],{"type":51,"value":2988},"addCustomTab()",{"type":46,"tag":47,"props":2990,"children":2991},{},[2992,2994,2998],{"type":51,"value":2993},"A shorthand for calling the hook ",{"type":46,"tag":73,"props":2995,"children":2996},{"className":40},[2997],{"type":51,"value":486},{"type":51,"value":468},{"type":46,"tag":66,"props":3000,"children":3002},{"className":137,"code":3001,"language":139,"meta":40,"style":40},"import { addCustomTab } from '@nuxt/devtools-kit'\n\naddCustomTab(() => ({\n // unique identifier\n name: 'my-module',\n // title to display in the tab\n title: 'My Module',\n // any icon from Iconify, or a URL to an image\n icon: 'carbon:apps',\n // iframe view\n view: {\n type: 'iframe',\n src: '/url-to-your-module-view',\n },\n}))\n",[3003],{"type":46,"tag":73,"props":3004,"children":3005},{"__ignoreMap":40},[3006,3041,3044,3071,3078,3105,3112,3139,3146,3173,3180,3195,3222,3249,3256],{"type":46,"tag":77,"props":3007,"children":3008},{"class":79,"line":80},[3009,3013,3017,3021,3025,3029,3033,3037],{"type":46,"tag":77,"props":3010,"children":3011},{"style":149},[3012],{"type":51,"value":152},{"type":46,"tag":77,"props":3014,"children":3015},{"style":155},[3016],{"type":51,"value":158},{"type":46,"tag":77,"props":3018,"children":3019},{"style":161},[3020],{"type":51,"value":164},{"type":46,"tag":77,"props":3022,"children":3023},{"style":155},[3024],{"type":51,"value":169},{"type":46,"tag":77,"props":3026,"children":3027},{"style":149},[3028],{"type":51,"value":174},{"type":46,"tag":77,"props":3030,"children":3031},{"style":155},[3032],{"type":51,"value":179},{"type":46,"tag":77,"props":3034,"children":3035},{"style":90},[3036],{"type":51,"value":184},{"type":46,"tag":77,"props":3038,"children":3039},{"style":155},[3040],{"type":51,"value":189},{"type":46,"tag":77,"props":3042,"children":3043},{"class":79,"line":192},[],{"type":46,"tag":77,"props":3045,"children":3046},{"class":79,"line":196},[3047,3051,3055,3059,3063,3067],{"type":46,"tag":77,"props":3048,"children":3049},{"style":200},[3050],{"type":51,"value":203},{"type":46,"tag":77,"props":3052,"children":3053},{"style":161},[3054],{"type":51,"value":208},{"type":46,"tag":77,"props":3056,"children":3057},{"style":155},[3058],{"type":51,"value":899},{"type":46,"tag":77,"props":3060,"children":3061},{"style":512},[3062],{"type":51,"value":515},{"type":46,"tag":77,"props":3064,"children":3065},{"style":161},[3066],{"type":51,"value":499},{"type":46,"tag":77,"props":3068,"children":3069},{"style":155},[3070],{"type":51,"value":213},{"type":46,"tag":77,"props":3072,"children":3073},{"class":79,"line":216},[3074],{"type":46,"tag":77,"props":3075,"children":3076},{"style":220},[3077],{"type":51,"value":223},{"type":46,"tag":77,"props":3079,"children":3080},{"class":79,"line":226},[3081,3085,3089,3093,3097,3101],{"type":46,"tag":77,"props":3082,"children":3083},{"style":230},[3084],{"type":51,"value":233},{"type":46,"tag":77,"props":3086,"children":3087},{"style":155},[3088],{"type":51,"value":238},{"type":46,"tag":77,"props":3090,"children":3091},{"style":155},[3092],{"type":51,"value":179},{"type":46,"tag":77,"props":3094,"children":3095},{"style":90},[3096],{"type":51,"value":247},{"type":46,"tag":77,"props":3098,"children":3099},{"style":155},[3100],{"type":51,"value":189},{"type":46,"tag":77,"props":3102,"children":3103},{"style":155},[3104],{"type":51,"value":256},{"type":46,"tag":77,"props":3106,"children":3107},{"class":79,"line":259},[3108],{"type":46,"tag":77,"props":3109,"children":3110},{"style":220},[3111],{"type":51,"value":265},{"type":46,"tag":77,"props":3113,"children":3114},{"class":79,"line":268},[3115,3119,3123,3127,3131,3135],{"type":46,"tag":77,"props":3116,"children":3117},{"style":230},[3118],{"type":51,"value":274},{"type":46,"tag":77,"props":3120,"children":3121},{"style":155},[3122],{"type":51,"value":238},{"type":46,"tag":77,"props":3124,"children":3125},{"style":155},[3126],{"type":51,"value":179},{"type":46,"tag":77,"props":3128,"children":3129},{"style":90},[3130],{"type":51,"value":287},{"type":46,"tag":77,"props":3132,"children":3133},{"style":155},[3134],{"type":51,"value":189},{"type":46,"tag":77,"props":3136,"children":3137},{"style":155},[3138],{"type":51,"value":256},{"type":46,"tag":77,"props":3140,"children":3141},{"class":79,"line":298},[3142],{"type":46,"tag":77,"props":3143,"children":3144},{"style":220},[3145],{"type":51,"value":304},{"type":46,"tag":77,"props":3147,"children":3148},{"class":79,"line":307},[3149,3153,3157,3161,3165,3169],{"type":46,"tag":77,"props":3150,"children":3151},{"style":230},[3152],{"type":51,"value":313},{"type":46,"tag":77,"props":3154,"children":3155},{"style":155},[3156],{"type":51,"value":238},{"type":46,"tag":77,"props":3158,"children":3159},{"style":155},[3160],{"type":51,"value":179},{"type":46,"tag":77,"props":3162,"children":3163},{"style":90},[3164],{"type":51,"value":326},{"type":46,"tag":77,"props":3166,"children":3167},{"style":155},[3168],{"type":51,"value":189},{"type":46,"tag":77,"props":3170,"children":3171},{"style":155},[3172],{"type":51,"value":256},{"type":46,"tag":77,"props":3174,"children":3175},{"class":79,"line":337},[3176],{"type":46,"tag":77,"props":3177,"children":3178},{"style":220},[3179],{"type":51,"value":343},{"type":46,"tag":77,"props":3181,"children":3182},{"class":79,"line":346},[3183,3187,3191],{"type":46,"tag":77,"props":3184,"children":3185},{"style":230},[3186],{"type":51,"value":352},{"type":46,"tag":77,"props":3188,"children":3189},{"style":155},[3190],{"type":51,"value":238},{"type":46,"tag":77,"props":3192,"children":3193},{"style":155},[3194],{"type":51,"value":158},{"type":46,"tag":77,"props":3196,"children":3197},{"class":79,"line":363},[3198,3202,3206,3210,3214,3218],{"type":46,"tag":77,"props":3199,"children":3200},{"style":230},[3201],{"type":51,"value":369},{"type":46,"tag":77,"props":3203,"children":3204},{"style":155},[3205],{"type":51,"value":238},{"type":46,"tag":77,"props":3207,"children":3208},{"style":155},[3209],{"type":51,"value":179},{"type":46,"tag":77,"props":3211,"children":3212},{"style":90},[3213],{"type":51,"value":382},{"type":46,"tag":77,"props":3215,"children":3216},{"style":155},[3217],{"type":51,"value":189},{"type":46,"tag":77,"props":3219,"children":3220},{"style":155},[3221],{"type":51,"value":256},{"type":46,"tag":77,"props":3223,"children":3224},{"class":79,"line":393},[3225,3229,3233,3237,3241,3245],{"type":46,"tag":77,"props":3226,"children":3227},{"style":230},[3228],{"type":51,"value":399},{"type":46,"tag":77,"props":3230,"children":3231},{"style":155},[3232],{"type":51,"value":238},{"type":46,"tag":77,"props":3234,"children":3235},{"style":155},[3236],{"type":51,"value":179},{"type":46,"tag":77,"props":3238,"children":3239},{"style":90},[3240],{"type":51,"value":412},{"type":46,"tag":77,"props":3242,"children":3243},{"style":155},[3244],{"type":51,"value":189},{"type":46,"tag":77,"props":3246,"children":3247},{"style":155},[3248],{"type":51,"value":256},{"type":46,"tag":77,"props":3250,"children":3251},{"class":79,"line":423},[3252],{"type":46,"tag":77,"props":3253,"children":3254},{"style":155},[3255],{"type":51,"value":429},{"type":46,"tag":77,"props":3257,"children":3258},{"class":79,"line":432},[3259,3263],{"type":46,"tag":77,"props":3260,"children":3261},{"style":155},[3262],{"type":51,"value":438},{"type":46,"tag":77,"props":3264,"children":3265},{"style":161},[3266],{"type":51,"value":3267},"))",{"type":46,"tag":2980,"props":3269,"children":3271},{"id":3270},"refreshcustomtabs",[3272],{"type":46,"tag":73,"props":3273,"children":3274},{"className":40},[3275],{"type":51,"value":3276},"refreshCustomTabs()",{"type":46,"tag":47,"props":3278,"children":3279},{},[3280,3282,3287],{"type":51,"value":3281},"A shorthand for call hook ",{"type":46,"tag":73,"props":3283,"children":3284},{"className":40},[3285],{"type":51,"value":3286},"devtools:customTabs:refresh",{"type":51,"value":3288},". It will refresh all custom tabs.",{"type":46,"tag":2980,"props":3290,"children":3292},{"id":3291},"startsubprocess",[3293],{"type":46,"tag":73,"props":3294,"children":3295},{"className":40},[3296],{"type":51,"value":3297},"startSubprocess()",{"type":46,"tag":47,"props":3299,"children":3300},{},[3301,3303,3308],{"type":51,"value":3302},"Start a sub process using ",{"type":46,"tag":73,"props":3304,"children":3305},{"className":40},[3306],{"type":51,"value":3307},"execa",{"type":51,"value":3309}," and create a terminal tab in DevTools.",{"type":46,"tag":66,"props":3311,"children":3313},{"className":137,"code":3312,"language":139,"meta":40,"style":40},"import { startSubprocess } from '@nuxt/devtools-kit'\n\nconst subprocess = startSubprocess(\n {\n command: 'code-server',\n args: [\n 'serve-local',\n '--accept-server-license-terms',\n '--without-connection-token',\n `--port=${port}`,\n ],\n },\n {\n id: 'devtools:vscode',\n name: 'VS Code Server',\n icon: 'logos-visual-studio-code',\n },\n)\n",[3314],{"type":46,"tag":73,"props":3315,"children":3316},{"__ignoreMap":40},[3317,3353,3356,3380,3388,3417,3433,3454,3474,3494,3526,3538,3545,3552,3581,3609,3637,3644],{"type":46,"tag":77,"props":3318,"children":3319},{"class":79,"line":80},[3320,3324,3328,3333,3337,3341,3345,3349],{"type":46,"tag":77,"props":3321,"children":3322},{"style":149},[3323],{"type":51,"value":152},{"type":46,"tag":77,"props":3325,"children":3326},{"style":155},[3327],{"type":51,"value":158},{"type":46,"tag":77,"props":3329,"children":3330},{"style":161},[3331],{"type":51,"value":3332}," startSubprocess",{"type":46,"tag":77,"props":3334,"children":3335},{"style":155},[3336],{"type":51,"value":169},{"type":46,"tag":77,"props":3338,"children":3339},{"style":149},[3340],{"type":51,"value":174},{"type":46,"tag":77,"props":3342,"children":3343},{"style":155},[3344],{"type":51,"value":179},{"type":46,"tag":77,"props":3346,"children":3347},{"style":90},[3348],{"type":51,"value":184},{"type":46,"tag":77,"props":3350,"children":3351},{"style":155},[3352],{"type":51,"value":189},{"type":46,"tag":77,"props":3354,"children":3355},{"class":79,"line":192},[],{"type":46,"tag":77,"props":3357,"children":3358},{"class":79,"line":196},[3359,3363,3368,3372,3376],{"type":46,"tag":77,"props":3360,"children":3361},{"style":512},[3362],{"type":51,"value":825},{"type":46,"tag":77,"props":3364,"children":3365},{"style":161},[3366],{"type":51,"value":3367}," subprocess ",{"type":46,"tag":77,"props":3369,"children":3370},{"style":155},[3371],{"type":51,"value":811},{"type":46,"tag":77,"props":3373,"children":3374},{"style":200},[3375],{"type":51,"value":3332},{"type":46,"tag":77,"props":3377,"children":3378},{"style":161},[3379],{"type":51,"value":208},{"type":46,"tag":77,"props":3381,"children":3382},{"class":79,"line":216},[3383],{"type":46,"tag":77,"props":3384,"children":3385},{"style":155},[3386],{"type":51,"value":3387}," {",{"type":46,"tag":77,"props":3389,"children":3390},{"class":79,"line":226},[3391,3396,3400,3404,3409,3413],{"type":46,"tag":77,"props":3392,"children":3393},{"style":230},[3394],{"type":51,"value":3395}," command",{"type":46,"tag":77,"props":3397,"children":3398},{"style":155},[3399],{"type":51,"value":238},{"type":46,"tag":77,"props":3401,"children":3402},{"style":155},[3403],{"type":51,"value":179},{"type":46,"tag":77,"props":3405,"children":3406},{"style":90},[3407],{"type":51,"value":3408},"code-server",{"type":46,"tag":77,"props":3410,"children":3411},{"style":155},[3412],{"type":51,"value":189},{"type":46,"tag":77,"props":3414,"children":3415},{"style":155},[3416],{"type":51,"value":256},{"type":46,"tag":77,"props":3418,"children":3419},{"class":79,"line":259},[3420,3425,3429],{"type":46,"tag":77,"props":3421,"children":3422},{"style":230},[3423],{"type":51,"value":3424}," args",{"type":46,"tag":77,"props":3426,"children":3427},{"style":155},[3428],{"type":51,"value":238},{"type":46,"tag":77,"props":3430,"children":3431},{"style":161},[3432],{"type":51,"value":1254},{"type":46,"tag":77,"props":3434,"children":3435},{"class":79,"line":268},[3436,3441,3446,3450],{"type":46,"tag":77,"props":3437,"children":3438},{"style":155},[3439],{"type":51,"value":3440}," '",{"type":46,"tag":77,"props":3442,"children":3443},{"style":90},[3444],{"type":51,"value":3445},"serve-local",{"type":46,"tag":77,"props":3447,"children":3448},{"style":155},[3449],{"type":51,"value":189},{"type":46,"tag":77,"props":3451,"children":3452},{"style":155},[3453],{"type":51,"value":256},{"type":46,"tag":77,"props":3455,"children":3456},{"class":79,"line":298},[3457,3461,3466,3470],{"type":46,"tag":77,"props":3458,"children":3459},{"style":155},[3460],{"type":51,"value":3440},{"type":46,"tag":77,"props":3462,"children":3463},{"style":90},[3464],{"type":51,"value":3465},"--accept-server-license-terms",{"type":46,"tag":77,"props":3467,"children":3468},{"style":155},[3469],{"type":51,"value":189},{"type":46,"tag":77,"props":3471,"children":3472},{"style":155},[3473],{"type":51,"value":256},{"type":46,"tag":77,"props":3475,"children":3476},{"class":79,"line":307},[3477,3481,3486,3490],{"type":46,"tag":77,"props":3478,"children":3479},{"style":155},[3480],{"type":51,"value":3440},{"type":46,"tag":77,"props":3482,"children":3483},{"style":90},[3484],{"type":51,"value":3485},"--without-connection-token",{"type":46,"tag":77,"props":3487,"children":3488},{"style":155},[3489],{"type":51,"value":189},{"type":46,"tag":77,"props":3491,"children":3492},{"style":155},[3493],{"type":51,"value":256},{"type":46,"tag":77,"props":3495,"children":3496},{"class":79,"line":337},[3497,3502,3507,3512,3517,3522],{"type":46,"tag":77,"props":3498,"children":3499},{"style":155},[3500],{"type":51,"value":3501}," `",{"type":46,"tag":77,"props":3503,"children":3504},{"style":90},[3505],{"type":51,"value":3506},"--port=",{"type":46,"tag":77,"props":3508,"children":3509},{"style":155},[3510],{"type":51,"value":3511},"${",{"type":46,"tag":77,"props":3513,"children":3514},{"style":161},[3515],{"type":51,"value":3516},"port",{"type":46,"tag":77,"props":3518,"children":3519},{"style":155},[3520],{"type":51,"value":3521},"}`",{"type":46,"tag":77,"props":3523,"children":3524},{"style":155},[3525],{"type":51,"value":256},{"type":46,"tag":77,"props":3527,"children":3528},{"class":79,"line":346},[3529,3534],{"type":46,"tag":77,"props":3530,"children":3531},{"style":161},[3532],{"type":51,"value":3533}," ]",{"type":46,"tag":77,"props":3535,"children":3536},{"style":155},[3537],{"type":51,"value":256},{"type":46,"tag":77,"props":3539,"children":3540},{"class":79,"line":363},[3541],{"type":46,"tag":77,"props":3542,"children":3543},{"style":155},[3544],{"type":51,"value":429},{"type":46,"tag":77,"props":3546,"children":3547},{"class":79,"line":393},[3548],{"type":46,"tag":77,"props":3549,"children":3550},{"style":155},[3551],{"type":51,"value":3387},{"type":46,"tag":77,"props":3553,"children":3554},{"class":79,"line":423},[3555,3560,3564,3568,3573,3577],{"type":46,"tag":77,"props":3556,"children":3557},{"style":230},[3558],{"type":51,"value":3559}," id",{"type":46,"tag":77,"props":3561,"children":3562},{"style":155},[3563],{"type":51,"value":238},{"type":46,"tag":77,"props":3565,"children":3566},{"style":155},[3567],{"type":51,"value":179},{"type":46,"tag":77,"props":3569,"children":3570},{"style":90},[3571],{"type":51,"value":3572},"devtools:vscode",{"type":46,"tag":77,"props":3574,"children":3575},{"style":155},[3576],{"type":51,"value":189},{"type":46,"tag":77,"props":3578,"children":3579},{"style":155},[3580],{"type":51,"value":256},{"type":46,"tag":77,"props":3582,"children":3583},{"class":79,"line":432},[3584,3588,3592,3596,3601,3605],{"type":46,"tag":77,"props":3585,"children":3586},{"style":230},[3587],{"type":51,"value":560},{"type":46,"tag":77,"props":3589,"children":3590},{"style":155},[3591],{"type":51,"value":238},{"type":46,"tag":77,"props":3593,"children":3594},{"style":155},[3595],{"type":51,"value":179},{"type":46,"tag":77,"props":3597,"children":3598},{"style":90},[3599],{"type":51,"value":3600},"VS Code Server",{"type":46,"tag":77,"props":3602,"children":3603},{"style":155},[3604],{"type":51,"value":189},{"type":46,"tag":77,"props":3606,"children":3607},{"style":155},[3608],{"type":51,"value":256},{"type":46,"tag":77,"props":3610,"children":3611},{"class":79,"line":1129},[3612,3616,3620,3624,3629,3633],{"type":46,"tag":77,"props":3613,"children":3614},{"style":230},[3615],{"type":51,"value":632},{"type":46,"tag":77,"props":3617,"children":3618},{"style":155},[3619],{"type":51,"value":238},{"type":46,"tag":77,"props":3621,"children":3622},{"style":155},[3623],{"type":51,"value":179},{"type":46,"tag":77,"props":3625,"children":3626},{"style":90},[3627],{"type":51,"value":3628},"logos-visual-studio-code",{"type":46,"tag":77,"props":3630,"children":3631},{"style":155},[3632],{"type":51,"value":189},{"type":46,"tag":77,"props":3634,"children":3635},{"style":155},[3636],{"type":51,"value":256},{"type":46,"tag":77,"props":3638,"children":3639},{"class":79,"line":1158},[3640],{"type":46,"tag":77,"props":3641,"children":3642},{"style":155},[3643],{"type":51,"value":429},{"type":46,"tag":77,"props":3645,"children":3646},{"class":79,"line":1167},[3647],{"type":46,"tag":77,"props":3648,"children":3649},{"style":161},[3650],{"type":51,"value":443},{"type":46,"tag":66,"props":3652,"children":3654},{"className":137,"code":3653,"language":139,"meta":40,"style":40},"subprocess.restart()\nsubprocess.terminate()\n",[3655],{"type":46,"tag":73,"props":3656,"children":3657},{"__ignoreMap":40},[3658,3679],{"type":46,"tag":77,"props":3659,"children":3660},{"class":79,"line":80},[3661,3666,3670,3675],{"type":46,"tag":77,"props":3662,"children":3663},{"style":161},[3664],{"type":51,"value":3665},"subprocess",{"type":46,"tag":77,"props":3667,"children":3668},{"style":155},[3669],{"type":51,"value":468},{"type":46,"tag":77,"props":3671,"children":3672},{"style":200},[3673],{"type":51,"value":3674},"restart",{"type":46,"tag":77,"props":3676,"children":3677},{"style":161},[3678],{"type":51,"value":899},{"type":46,"tag":77,"props":3680,"children":3681},{"class":79,"line":192},[3682,3686,3690,3695],{"type":46,"tag":77,"props":3683,"children":3684},{"style":161},[3685],{"type":51,"value":3665},{"type":46,"tag":77,"props":3687,"children":3688},{"style":155},[3689],{"type":51,"value":468},{"type":46,"tag":77,"props":3691,"children":3692},{"style":200},[3693],{"type":51,"value":3694},"terminate",{"type":46,"tag":77,"props":3696,"children":3697},{"style":161},[3698],{"type":51,"value":899},{"type":46,"tag":2980,"props":3700,"children":3702},{"id":3701},"extendserverrpc",[3703],{"type":46,"tag":73,"props":3704,"children":3705},{"className":40},[3706],{"type":51,"value":3707},"extendServerRpc()",{"type":46,"tag":47,"props":3709,"children":3710},{},[3711],{"type":51,"value":3712},"Extend the server RPC with your own methods.",{"type":46,"tag":66,"props":3714,"children":3716},{"className":137,"code":3715,"language":139,"meta":40,"style":40},"import { extendServerRpc } from '@nuxt/devtools-kit'\n\nconst rpc = extendServerRpc('my-module', {\n async myMethod() {\n return 'hello'\n },\n})\n",[3717],{"type":46,"tag":73,"props":3718,"children":3719},{"__ignoreMap":40},[3720,3755,3758,3802,3823,3844,3851],{"type":46,"tag":77,"props":3721,"children":3722},{"class":79,"line":80},[3723,3727,3731,3735,3739,3743,3747,3751],{"type":46,"tag":77,"props":3724,"children":3725},{"style":149},[3726],{"type":51,"value":152},{"type":46,"tag":77,"props":3728,"children":3729},{"style":155},[3730],{"type":51,"value":158},{"type":46,"tag":77,"props":3732,"children":3733},{"style":161},[3734],{"type":51,"value":1687},{"type":46,"tag":77,"props":3736,"children":3737},{"style":155},[3738],{"type":51,"value":169},{"type":46,"tag":77,"props":3740,"children":3741},{"style":149},[3742],{"type":51,"value":174},{"type":46,"tag":77,"props":3744,"children":3745},{"style":155},[3746],{"type":51,"value":179},{"type":46,"tag":77,"props":3748,"children":3749},{"style":90},[3750],{"type":51,"value":184},{"type":46,"tag":77,"props":3752,"children":3753},{"style":155},[3754],{"type":51,"value":189},{"type":46,"tag":77,"props":3756,"children":3757},{"class":79,"line":192},[],{"type":46,"tag":77,"props":3759,"children":3760},{"class":79,"line":196},[3761,3765,3770,3774,3778,3782,3786,3790,3794,3798],{"type":46,"tag":77,"props":3762,"children":3763},{"style":512},[3764],{"type":51,"value":825},{"type":46,"tag":77,"props":3766,"children":3767},{"style":161},[3768],{"type":51,"value":3769}," rpc ",{"type":46,"tag":77,"props":3771,"children":3772},{"style":155},[3773],{"type":51,"value":811},{"type":46,"tag":77,"props":3775,"children":3776},{"style":200},[3777],{"type":51,"value":1687},{"type":46,"tag":77,"props":3779,"children":3780},{"style":161},[3781],{"type":51,"value":208},{"type":46,"tag":77,"props":3783,"children":3784},{"style":155},[3785],{"type":51,"value":189},{"type":46,"tag":77,"props":3787,"children":3788},{"style":90},[3789],{"type":51,"value":247},{"type":46,"tag":77,"props":3791,"children":3792},{"style":155},[3793],{"type":51,"value":189},{"type":46,"tag":77,"props":3795,"children":3796},{"style":155},[3797],{"type":51,"value":256},{"type":46,"tag":77,"props":3799,"children":3800},{"style":155},[3801],{"type":51,"value":158},{"type":46,"tag":77,"props":3803,"children":3804},{"class":79,"line":216},[3805,3810,3815,3819],{"type":46,"tag":77,"props":3806,"children":3807},{"style":512},[3808],{"type":51,"value":3809}," async",{"type":46,"tag":77,"props":3811,"children":3812},{"style":230},[3813],{"type":51,"value":3814}," myMethod",{"type":46,"tag":77,"props":3816,"children":3817},{"style":155},[3818],{"type":51,"value":899},{"type":46,"tag":77,"props":3820,"children":3821},{"style":155},[3822],{"type":51,"value":158},{"type":46,"tag":77,"props":3824,"children":3825},{"class":79,"line":226},[3826,3831,3835,3840],{"type":46,"tag":77,"props":3827,"children":3828},{"style":149},[3829],{"type":51,"value":3830}," return",{"type":46,"tag":77,"props":3832,"children":3833},{"style":155},[3834],{"type":51,"value":179},{"type":46,"tag":77,"props":3836,"children":3837},{"style":90},[3838],{"type":51,"value":3839},"hello",{"type":46,"tag":77,"props":3841,"children":3842},{"style":155},[3843],{"type":51,"value":189},{"type":46,"tag":77,"props":3845,"children":3846},{"class":79,"line":259},[3847],{"type":46,"tag":77,"props":3848,"children":3849},{"style":155},[3850],{"type":51,"value":429},{"type":46,"tag":77,"props":3852,"children":3853},{"class":79,"line":268},[3854,3858],{"type":46,"tag":77,"props":3855,"children":3856},{"style":155},[3857],{"type":51,"value":438},{"type":46,"tag":77,"props":3859,"children":3860},{"style":161},[3861],{"type":51,"value":443},{"type":46,"tag":47,"props":3863,"children":3864},{},[3865,3866,3872],{"type":51,"value":768},{"type":46,"tag":770,"props":3867,"children":3869},{"href":3868},"/module/guide#custom-rpc-functions",[3870],{"type":51,"value":3871},"Custom RPC functions",{"type":51,"value":468},{"type":46,"tag":54,"props":3874,"children":3876},{"id":3875},"nuxtdevtools-kitiframe-client",[3877],{"type":46,"tag":73,"props":3878,"children":3879},{"className":40},[3880],{"type":51,"value":2155},{"type":46,"tag":47,"props":3882,"children":3883},{},[3884],{"type":51,"value":3885},"To provide complex interactions for your module integrations, we recommend to host your own view and display it in devtools via iframe.",{"type":46,"tag":47,"props":3887,"children":3888},{},[3889],{"type":51,"value":3890},"To get the infomation from the devtools and the client app, you can do this in your client app:",{"type":46,"tag":66,"props":3892,"children":3894},{"className":137,"code":3893,"language":139,"meta":40,"style":40},"import { useDevtoolsClient } from '@nuxt/devtools-kit/iframe-client'\n\nexport const devtoolsClient = useDevtoolsClient()\n",[3895],{"type":46,"tag":73,"props":3896,"children":3897},{"__ignoreMap":40},[3898,3934,3937],{"type":46,"tag":77,"props":3899,"children":3900},{"class":79,"line":80},[3901,3905,3909,3914,3918,3922,3926,3930],{"type":46,"tag":77,"props":3902,"children":3903},{"style":149},[3904],{"type":51,"value":152},{"type":46,"tag":77,"props":3906,"children":3907},{"style":155},[3908],{"type":51,"value":158},{"type":46,"tag":77,"props":3910,"children":3911},{"style":161},[3912],{"type":51,"value":3913}," useDevtoolsClient",{"type":46,"tag":77,"props":3915,"children":3916},{"style":155},[3917],{"type":51,"value":169},{"type":46,"tag":77,"props":3919,"children":3920},{"style":149},[3921],{"type":51,"value":174},{"type":46,"tag":77,"props":3923,"children":3924},{"style":155},[3925],{"type":51,"value":179},{"type":46,"tag":77,"props":3927,"children":3928},{"style":90},[3929],{"type":51,"value":2155},{"type":46,"tag":77,"props":3931,"children":3932},{"style":155},[3933],{"type":51,"value":189},{"type":46,"tag":77,"props":3935,"children":3936},{"class":79,"line":192},[],{"type":46,"tag":77,"props":3938,"children":3939},{"class":79,"line":196},[3940,3944,3949,3953,3957,3961],{"type":46,"tag":77,"props":3941,"children":3942},{"style":149},[3943],{"type":51,"value":1517},{"type":46,"tag":77,"props":3945,"children":3946},{"style":512},[3947],{"type":51,"value":3948}," const",{"type":46,"tag":77,"props":3950,"children":3951},{"style":161},[3952],{"type":51,"value":2637},{"type":46,"tag":77,"props":3954,"children":3955},{"style":155},[3956],{"type":51,"value":811},{"type":46,"tag":77,"props":3958,"children":3959},{"style":200},[3960],{"type":51,"value":3913},{"type":46,"tag":77,"props":3962,"children":3963},{"style":161},[3964],{"type":51,"value":899},{"type":46,"tag":47,"props":3966,"children":3967},{},[3968,3970,3975,3977,3982],{"type":51,"value":3969},"When the iframe been served with the same origin (CORS limitation), devtools will automatically inject ",{"type":46,"tag":73,"props":3971,"children":3972},{"className":40},[3973],{"type":51,"value":3974},"__NUXT_DEVTOOLS__",{"type":51,"value":3976}," to the iframe's window object. You can access it as a ref using ",{"type":46,"tag":73,"props":3978,"children":3979},{"className":40},[3980],{"type":51,"value":3981},"useDevtoolsClient()",{"type":51,"value":3983}," utility.",{"type":46,"tag":2980,"props":3985,"children":3987},{"id":3986},"usedevtoolsclient",[3988],{"type":46,"tag":73,"props":3989,"children":3990},{"className":40},[3991],{"type":51,"value":3981},{"type":46,"tag":47,"props":3993,"children":3994},{},[3995,3997,4002,4004,4009],{"type":51,"value":3996},"It will return a ref of ",{"type":46,"tag":73,"props":3998,"children":3999},{"className":40},[4000],{"type":51,"value":4001},"NuxtDevtoolsIframeClient",{"type":51,"value":4003}," object that are intially ",{"type":46,"tag":73,"props":4005,"children":4006},{"className":40},[4007],{"type":51,"value":4008},"null",{"type":51,"value":4010}," and will be updated when the connection is ready.",{"type":46,"tag":47,"props":4012,"children":4013},{},[4014,4018],{"type":46,"tag":73,"props":4015,"children":4016},{"className":40},[4017],{"type":51,"value":4001},{"type":51,"value":4019}," contains two properties:",{"type":46,"tag":2495,"props":4021,"children":4022},{},[4023,4033],{"type":46,"tag":2499,"props":4024,"children":4025},{},[4026,4031],{"type":46,"tag":73,"props":4027,"children":4028},{"className":40},[4029],{"type":51,"value":4030},"host",{"type":51,"value":4032},": APIs to communicate with the client app",{"type":46,"tag":2499,"props":4034,"children":4035},{},[4036,4040],{"type":46,"tag":73,"props":4037,"children":4038},{"className":40},[4039],{"type":51,"value":2306},{"type":51,"value":4041},": APIs to communicate with the devtools",{"type":46,"tag":47,"props":4043,"children":4044},{},[4045,4049],{"type":46,"tag":73,"props":4046,"children":4047},{"className":40},[4048],{"type":51,"value":4030},{"type":51,"value":4050}," can be undefined when devtools are accessed standalone or from a different origin.",{"type":46,"tag":47,"props":4052,"children":4053},{},[4054],{"type":51,"value":4055},"For example, you can get the router instance from the client app:",{"type":46,"tag":66,"props":4057,"children":4059},{"className":137,"code":4058,"language":139,"meta":40,"style":40},"const router = computed(() => devtoolsClient.value?.host?.nuxt.vueApp.config.globalProperties?.$router)\n",[4060],{"type":46,"tag":73,"props":4061,"children":4062},{"__ignoreMap":40},[4063],{"type":46,"tag":77,"props":4064,"children":4065},{"class":79,"line":80},[4066,4070,4075,4079,4084,4088,4092,4096,4101,4105,4110,4115,4119,4123,4127,4131,4136,4140,4145,4149,4154,4158],{"type":46,"tag":77,"props":4067,"children":4068},{"style":512},[4069],{"type":51,"value":825},{"type":46,"tag":77,"props":4071,"children":4072},{"style":161},[4073],{"type":51,"value":4074}," router ",{"type":46,"tag":77,"props":4076,"children":4077},{"style":155},[4078],{"type":51,"value":811},{"type":46,"tag":77,"props":4080,"children":4081},{"style":200},[4082],{"type":51,"value":4083}," computed",{"type":46,"tag":77,"props":4085,"children":4086},{"style":161},[4087],{"type":51,"value":208},{"type":46,"tag":77,"props":4089,"children":4090},{"style":155},[4091],{"type":51,"value":899},{"type":46,"tag":77,"props":4093,"children":4094},{"style":512},[4095],{"type":51,"value":515},{"type":46,"tag":77,"props":4097,"children":4098},{"style":161},[4099],{"type":51,"value":4100}," devtoolsClient",{"type":46,"tag":77,"props":4102,"children":4103},{"style":155},[4104],{"type":51,"value":468},{"type":46,"tag":77,"props":4106,"children":4107},{"style":161},[4108],{"type":51,"value":4109},"value",{"type":46,"tag":77,"props":4111,"children":4112},{"style":155},[4113],{"type":51,"value":4114},"?.",{"type":46,"tag":77,"props":4116,"children":4117},{"style":161},[4118],{"type":51,"value":4030},{"type":46,"tag":77,"props":4120,"children":4121},{"style":155},[4122],{"type":51,"value":4114},{"type":46,"tag":77,"props":4124,"children":4125},{"style":161},[4126],{"type":51,"value":463},{"type":46,"tag":77,"props":4128,"children":4129},{"style":155},[4130],{"type":51,"value":468},{"type":46,"tag":77,"props":4132,"children":4133},{"style":161},[4134],{"type":51,"value":4135},"vueApp",{"type":46,"tag":77,"props":4137,"children":4138},{"style":155},[4139],{"type":51,"value":468},{"type":46,"tag":77,"props":4141,"children":4142},{"style":161},[4143],{"type":51,"value":4144},"config",{"type":46,"tag":77,"props":4146,"children":4147},{"style":155},[4148],{"type":51,"value":468},{"type":46,"tag":77,"props":4150,"children":4151},{"style":161},[4152],{"type":51,"value":4153},"globalProperties",{"type":46,"tag":77,"props":4155,"children":4156},{"style":155},[4157],{"type":51,"value":4114},{"type":46,"tag":77,"props":4159,"children":4160},{"style":161},[4161],{"type":51,"value":4162},"$router)",{"type":46,"tag":2980,"props":4164,"children":4166},{"id":4165},"ondevtoolsclientconnected",[4167],{"type":46,"tag":73,"props":4168,"children":4169},{"className":40},[4170],{"type":51,"value":4171},"onDevtoolsClientConnected()",{"type":46,"tag":47,"props":4173,"children":4174},{},[4175,4177,4181],{"type":51,"value":4176},"Similiar to ",{"type":46,"tag":73,"props":4178,"children":4179},{"className":40},[4180],{"type":51,"value":3981},{"type":51,"value":4182}," but as a callback style:",{"type":46,"tag":66,"props":4184,"children":4186},{"className":137,"code":4185,"language":139,"meta":40,"style":40},"import { onDevtoolsClientConnected } from '@nuxt/devtools-kit/iframe-client'\n\nonDevtoolsClientConnected(async (client) => {\n // client is NuxtDevtoolsIframeClient\n\n const config = client.devtools.rpc.getServerConfig()\n // ...\n})\n",[4187],{"type":46,"tag":73,"props":4188,"children":4189},{"__ignoreMap":40},[4190,4225,4228,4263,4271,4274,4324,4332],{"type":46,"tag":77,"props":4191,"children":4192},{"class":79,"line":80},[4193,4197,4201,4205,4209,4213,4217,4221],{"type":46,"tag":77,"props":4194,"children":4195},{"style":149},[4196],{"type":51,"value":152},{"type":46,"tag":77,"props":4198,"children":4199},{"style":155},[4200],{"type":51,"value":158},{"type":46,"tag":77,"props":4202,"children":4203},{"style":161},[4204],{"type":51,"value":2138},{"type":46,"tag":77,"props":4206,"children":4207},{"style":155},[4208],{"type":51,"value":169},{"type":46,"tag":77,"props":4210,"children":4211},{"style":149},[4212],{"type":51,"value":174},{"type":46,"tag":77,"props":4214,"children":4215},{"style":155},[4216],{"type":51,"value":179},{"type":46,"tag":77,"props":4218,"children":4219},{"style":90},[4220],{"type":51,"value":2155},{"type":46,"tag":77,"props":4222,"children":4223},{"style":155},[4224],{"type":51,"value":189},{"type":46,"tag":77,"props":4226,"children":4227},{"class":79,"line":192},[],{"type":46,"tag":77,"props":4229,"children":4230},{"class":79,"line":196},[4231,4235,4239,4243,4247,4251,4255,4259],{"type":46,"tag":77,"props":4232,"children":4233},{"style":200},[4234],{"type":51,"value":2247},{"type":46,"tag":77,"props":4236,"children":4237},{"style":161},[4238],{"type":51,"value":208},{"type":46,"tag":77,"props":4240,"children":4241},{"style":512},[4242],{"type":51,"value":884},{"type":46,"tag":77,"props":4244,"children":4245},{"style":155},[4246],{"type":51,"value":499},{"type":46,"tag":77,"props":4248,"children":4249},{"style":502},[4250],{"type":51,"value":2264},{"type":46,"tag":77,"props":4252,"children":4253},{"style":155},[4254],{"type":51,"value":443},{"type":46,"tag":77,"props":4256,"children":4257},{"style":512},[4258],{"type":51,"value":515},{"type":46,"tag":77,"props":4260,"children":4261},{"style":155},[4262],{"type":51,"value":158},{"type":46,"tag":77,"props":4264,"children":4265},{"class":79,"line":216},[4266],{"type":46,"tag":77,"props":4267,"children":4268},{"style":220},[4269],{"type":51,"value":4270}," // client is NuxtDevtoolsIframeClient",{"type":46,"tag":77,"props":4272,"children":4273},{"class":79,"line":226},[],{"type":46,"tag":77,"props":4275,"children":4276},{"class":79,"line":259},[4277,4281,4286,4290,4294,4298,4302,4306,4311,4315,4320],{"type":46,"tag":77,"props":4278,"children":4279},{"style":512},[4280],{"type":51,"value":2284},{"type":46,"tag":77,"props":4282,"children":4283},{"style":161},[4284],{"type":51,"value":4285}," config",{"type":46,"tag":77,"props":4287,"children":4288},{"style":155},[4289],{"type":51,"value":869},{"type":46,"tag":77,"props":4291,"children":4292},{"style":161},[4293],{"type":51,"value":2297},{"type":46,"tag":77,"props":4295,"children":4296},{"style":155},[4297],{"type":51,"value":468},{"type":46,"tag":77,"props":4299,"children":4300},{"style":161},[4301],{"type":51,"value":2306},{"type":46,"tag":77,"props":4303,"children":4304},{"style":155},[4305],{"type":51,"value":468},{"type":46,"tag":77,"props":4307,"children":4308},{"style":161},[4309],{"type":51,"value":4310},"rpc",{"type":46,"tag":77,"props":4312,"children":4313},{"style":155},[4314],{"type":51,"value":468},{"type":46,"tag":77,"props":4316,"children":4317},{"style":200},[4318],{"type":51,"value":4319},"getServerConfig",{"type":46,"tag":77,"props":4321,"children":4322},{"style":230},[4323],{"type":51,"value":899},{"type":46,"tag":77,"props":4325,"children":4326},{"class":79,"line":268},[4327],{"type":46,"tag":77,"props":4328,"children":4329},{"style":220},[4330],{"type":51,"value":4331}," // ...",{"type":46,"tag":77,"props":4333,"children":4334},{"class":79,"line":298},[4335,4339],{"type":46,"tag":77,"props":4336,"children":4337},{"style":155},[4338],{"type":51,"value":438},{"type":46,"tag":77,"props":4340,"children":4341},{"style":161},[4342],{"type":51,"value":443},{"type":46,"tag":2551,"props":4344,"children":4345},{},[4346],{"type":51,"value":2555},{"title":40,"searchDepth":192,"depth":192,"links":4348},[4349,4355],{"id":2973,"depth":192,"text":184,"children":4350},[4351,4352,4353,4354],{"id":2982,"depth":196,"text":2988},{"id":3270,"depth":196,"text":3276},{"id":3291,"depth":196,"text":3297},{"id":3701,"depth":196,"text":3707},{"id":3875,"depth":192,"text":2155,"children":4356},[4357,4358],{"id":3986,"depth":196,"text":3981},{"id":4165,"depth":196,"text":4171},"content:2.module:1.utils-kit.md","2.module/1.utils-kit.md",1698390519113]