[{"data":1,"prerenderedAt":1595},["Reactive",2],{"navigation":3,"docs-/guide/features":37,"docs-/guide/features-surround":529},[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":13,"_dir":38,"_draft":39,"_partial":39,"_locale":40,"title":12,"description":41,"body":42,"_type":524,"_id":525,"_source":526,"_file":527,"_extension":528},"guide",false,"","Discover all the features the Nuxt Devtools can offer.",{"type":43,"children":44,"toc":496},"root",[45,64,71,76,82,88,93,97,103,108,112,117,121,126,130,136,141,145,151,156,160,165,171,176,181,187,192,198,203,209,214,220,225,231,236,242,247,253,258,264,269,281,287,292,304,316,322,327,331,337,342,346,352,370,374,380,385,391,433,440,459,464,481,486],{"type":46,"tag":47,"props":48,"children":49},"element","p",{},[50,53,62],{"type":51,"value":52},"text","You can learn more in our ",{"type":46,"tag":54,"props":55,"children":59},"a",{"href":56,"rel":57},"https://github.com/nuxt/devtools/discussions/31",[58],"nofollow",[60],{"type":51,"value":61},"roadmap",{"type":51,"value":63},".",{"type":46,"tag":65,"props":66,"children":68},"h2",{"id":67},"overview",[69],{"type":51,"value":70},"Overview",{"type":46,"tag":47,"props":72,"children":73},{},[74],{"type":51,"value":75},"Shows a quick overview of your app, including the Nuxt version (which if it’s not up to date you can easily update it), Vue version, pages, components, imports, modules and plugins that you are using, and your app’s loading time and more!",{"type":46,"tag":77,"props":78,"children":81},"img",{"width":79,"src":80},1284,"https://user-images.githubusercontent.com/11247099/217670797-12c33a03-ca4f-490d-a18a-ab9008b89c15.png",[],{"type":46,"tag":65,"props":83,"children":85},{"id":84},"pages",[86],{"type":51,"value":87},"Pages",{"type":46,"tag":47,"props":89,"children":90},{},[91],{"type":51,"value":92},"Pages tab shows your current routes with some useful information such as what layout or middleware it has, and provides a quick way to navigate between pages. You can also use the textbox to see how each route is matched.",{"type":46,"tag":77,"props":94,"children":96},{"width":79,"src":95},"https://user-images.githubusercontent.com/11247099/217670804-e48482af-de37-47be-88d8-d9515e796d5f.png",[],{"type":46,"tag":65,"props":98,"children":100},{"id":99},"components",[101],{"type":51,"value":102},"Components",{"type":46,"tag":47,"props":104,"children":105},{},[106],{"type":51,"value":107},"Components tab shows all the components you are using in your app and where they are from. You can also search for them and go to the source code.",{"type":46,"tag":77,"props":109,"children":111},{"width":79,"src":110},"https://user-images.githubusercontent.com/11247099/217670805-726eafd1-5364-4b11-9c2b-9253d068e7e3.png",[],{"type":46,"tag":47,"props":113,"children":114},{},[115],{"type":51,"value":116},"Components tab also has a Graph view which you can toggle.\nGraph view also shows the relationship between components, and knows the dependencies of each component.",{"type":46,"tag":77,"props":118,"children":120},{"width":79,"src":119},"https://user-images.githubusercontent.com/11247099/217670806-fb39aeff-3881-44e5-b9c8-6c757f5925fc.png",[],{"type":46,"tag":47,"props":122,"children":123},{},[124],{"type":51,"value":125},"You can also inspect your app's DOM tree and see which component is rendering it. Finding the place to make changes are much easier.",{"type":46,"tag":77,"props":127,"children":129},{"width":79,"src":128},"https://user-images.githubusercontent.com/11247099/217670809-7dcb4198-5a74-4818-95b1-b62ea6c04a6c.png",[],{"type":46,"tag":65,"props":131,"children":133},{"id":132},"imports",[134],{"type":51,"value":135},"Imports",{"type":46,"tag":47,"props":137,"children":138},{},[139],{"type":51,"value":140},"Imports tab shows all the auto-imports registered to Nuxt. You can see which files are importing them, and where they are from. Some entries can also provide short descriptions and documentation links.",{"type":46,"tag":77,"props":142,"children":144},{"width":79,"src":143},"https://user-images.githubusercontent.com/11247099/217670811-fa7c7249-5a21-48c9-abe8-ca02b2518a3a.png",[],{"type":46,"tag":65,"props":146,"children":148},{"id":147},"modules",[149],{"type":51,"value":150},"Modules",{"type":46,"tag":47,"props":152,"children":153},{},[154],{"type":51,"value":155},"Modules tab shows all the modules you have installed and their information such as the module’s github repository, documentation, version and …",{"type":46,"tag":77,"props":157,"children":159},{"width":79,"src":158},"https://user-images.githubusercontent.com/11247099/217670813-ce3da4b6-269c-430e-abb5-a2263ffe4938.png",[],{"type":46,"tag":47,"props":161,"children":162},{},[163],{"type":51,"value":164},"You can install or even remove any Nuxt module with one-click!",{"type":46,"tag":65,"props":166,"children":168},{"id":167},"assets",[169],{"type":51,"value":170},"Assets",{"type":46,"tag":47,"props":172,"children":173},{},[174],{"type":51,"value":175},"Assets tab shows your files from the Public directory, you can see the information of selected file with some helpful actions.",{"type":46,"tag":47,"props":177,"children":178},{},[179],{"type":51,"value":180},"You can also upload files with Drag & Drop ability",{"type":46,"tag":65,"props":182,"children":184},{"id":183},"terminals",[185],{"type":51,"value":186},"Terminals",{"type":46,"tag":47,"props":188,"children":189},{},[190],{"type":51,"value":191},"Terminals tab shows the active terminal processes.",{"type":46,"tag":65,"props":193,"children":195},{"id":194},"runtime-config",[196],{"type":51,"value":197},"Runtime Config",{"type":46,"tag":47,"props":199,"children":200},{},[201],{"type":51,"value":202},"Runtime Config tab shows all the runtime config of your project, with the ability to edit them.",{"type":46,"tag":65,"props":204,"children":206},{"id":205},"payload",[207],{"type":51,"value":208},"Payload",{"type":46,"tag":47,"props":210,"children":211},{},[212],{"type":51,"value":213},"Payloads tab shows all the state and data payloads of your project.",{"type":46,"tag":65,"props":215,"children":217},{"id":216},"build-analyze",[218],{"type":51,"value":219},"Build Analyze",{"type":46,"tag":47,"props":221,"children":222},{},[223],{"type":51,"value":224},"In the Build Analyze tab, you can run analyze build and see the bundle size of your project. it saves the report so you can compare the bundle size in different builds.",{"type":46,"tag":65,"props":226,"children":228},{"id":227},"open-graph",[229],{"type":51,"value":230},"Open Graph",{"type":46,"tag":47,"props":232,"children":233},{},[234],{"type":51,"value":235},"Open Graph tab is to help you with SEO, it shows you a Social Preview Card for twitter, facebook and linkedIn for your page. It also provides missing SEO tags with the ability to copy code snippets.",{"type":46,"tag":65,"props":237,"children":239},{"id":238},"plugins",[240],{"type":51,"value":241},"Plugins",{"type":46,"tag":47,"props":243,"children":244},{},[245],{"type":51,"value":246},"Plugins tab shows all the plugins your project is using, with some information such as plugin's initialization time.",{"type":46,"tag":65,"props":248,"children":250},{"id":249},"server-routes",[251],{"type":51,"value":252},"Server Routes",{"type":46,"tag":47,"props":254,"children":255},{},[256],{"type":51,"value":257},"Server Routes tab shows all nitro routes in your project. It provides a playground to send and test your endpoints.",{"type":46,"tag":65,"props":259,"children":261},{"id":260},"storage",[262],{"type":51,"value":263},"Storage",{"type":46,"tag":47,"props":265,"children":266},{},[267],{"type":51,"value":268},"Storage tab shows all the nitro storage in your project. You can create, edit, and delete files.",{"type":46,"tag":47,"props":270,"children":271},{},[272,274],{"type":51,"value":273},"Learn more about ",{"type":46,"tag":54,"props":275,"children":278},{"href":276,"rel":277},"https://nitro.unjs.io/guide/storage",[58],[279],{"type":51,"value":280},"Nitro Storage",{"type":46,"tag":65,"props":282,"children":284},{"id":283},"vs-code-server",[285],{"type":51,"value":286},"VS Code Server",{"type":46,"tag":47,"props":288,"children":289},{},[290],{"type":51,"value":291},"The VS Code Server integration in Nuxt DevTools enhances your development experience by bringing the power of Visual Studio Code directly into your browser. With this feature, you can seamlessly edit and debug your Nuxt projects using the familiar interface of VS Code.",{"type":46,"tag":47,"props":293,"children":294},{},[295,297],{"type":51,"value":296},"To get started with VS Code Server, follow the installation instructions provided by ",{"type":46,"tag":54,"props":298,"children":301},{"href":299,"rel":300},"https://coder.com/docs/code-server/latest/install",[58],[302],{"type":51,"value":303},"Code Server Installation Guide",{"type":46,"tag":47,"props":305,"children":306},{},[307,309],{"type":51,"value":308},"For more information on the benefits and features of VS Code Server, refer to ",{"type":46,"tag":54,"props":310,"children":313},{"href":311,"rel":312},"https://code.visualstudio.com/blogs/2022/07/07/vscode-server",[58],[314],{"type":51,"value":315},"the official Visual Studio Code blog",{"type":46,"tag":65,"props":317,"children":319},{"id":318},"hooks",[320],{"type":51,"value":321},"Hooks",{"type":46,"tag":47,"props":323,"children":324},{},[325],{"type":51,"value":326},"Hooks tab can help you to monitor the time spent in each hook. It can be helpful to find performance bottlenecks.",{"type":46,"tag":77,"props":328,"children":330},{"width":79,"src":329},"https://user-images.githubusercontent.com/11247099/217670815-80ec0ec3-7df1-4a07-96fb-4161fb6562a7.png",[],{"type":46,"tag":65,"props":332,"children":334},{"id":333},"virtual-files",[335],{"type":51,"value":336},"Virtual Files",{"type":46,"tag":47,"props":338,"children":339},{},[340],{"type":51,"value":341},"Virtual Files tab shows the virtual files generated by Nuxt to support the conventions.",{"type":46,"tag":77,"props":343,"children":345},{"width":79,"src":344},"https://user-images.githubusercontent.com/11247099/217670817-abb0315a-6d92-4c5e-a4da-2327f22e0e8b.png",[],{"type":46,"tag":65,"props":347,"children":349},{"id":348},"inspect",[350],{"type":51,"value":351},"Inspect",{"type":46,"tag":47,"props":353,"children":354},{},[355,357,368],{"type":51,"value":356},"Inspect expose the ",{"type":46,"tag":54,"props":358,"children":361},{"href":359,"rel":360},"https://github.com/antfu/vite-plugin-inspect",[58],[362],{"type":46,"tag":363,"props":364,"children":365},"code",{"className":40},[366],{"type":51,"value":367},"vite-plugin-inspect",{"type":51,"value":369}," integration, allowing you to inspect transformation steps of Vite.",{"type":46,"tag":77,"props":371,"children":373},{"width":79,"src":372},"https://user-images.githubusercontent.com/11247099/217670818-77f91135-7318-462e-9148-4ad504c82555.png",[],{"type":46,"tag":65,"props":375,"children":377},{"id":376},"settings",[378],{"type":51,"value":379},"Settings",{"type":46,"tag":47,"props":381,"children":382},{},[383],{"type":51,"value":384},"Settings tab allows you to configure the DevTools to your needs. you can hide tabs, change tabs order, scale, theme and more...",{"type":46,"tag":65,"props":386,"children":388},{"id":387},"nuxt-icon",[389],{"type":51,"value":390},"Nuxt Icon",{"type":46,"tag":47,"props":392,"children":393},{},[394,396,401,403,407,408,413,414,419,420,425,426,431],{"type":51,"value":395},"Nuxt Icon is the first item on sidebar, located at the top left corner of the DevTools. It gives you a quick access to some useful features such as ",{"type":46,"tag":363,"props":397,"children":398},{"className":40},[399],{"type":51,"value":400},"Toggle Theme",{"type":51,"value":402},", ",{"type":46,"tag":363,"props":404,"children":405},{"className":40},[406],{"type":51,"value":379},{"type":51,"value":402},{"type":46,"tag":363,"props":409,"children":410},{"className":40},[411],{"type":51,"value":412},"Split Screen",{"type":51,"value":402},{"type":46,"tag":363,"props":415,"children":416},{"className":40},[417],{"type":51,"value":418},"Popup",{"type":51,"value":402},{"type":46,"tag":363,"props":421,"children":422},{"className":40},[423],{"type":51,"value":424},"Refresh Data",{"type":51,"value":402},{"type":46,"tag":363,"props":427,"children":428},{"className":40},[429],{"type":51,"value":430},"Refresh Page",{"type":51,"value":432},". you can simply click on it and see the them yourself.",{"type":46,"tag":434,"props":435,"children":437},"h3",{"id":436},"command-palette",[438],{"type":51,"value":439},"Command Palette",{"type":46,"tag":47,"props":441,"children":442},{},[443,445,450,452,457],{"type":51,"value":444},"Command Palette is a quick way to access some useful features of the DevTools such as easy navigation, run commands and Nuxt Documentations. You can open it with ",{"type":46,"tag":363,"props":446,"children":447},{"className":40},[448],{"type":51,"value":449},"Ctrl+Shift+K",{"type":51,"value":451}," or ",{"type":46,"tag":363,"props":453,"children":454},{"className":40},[455],{"type":51,"value":456},"Cmd+Shift+K",{"type":51,"value":458}," shortcut.",{"type":46,"tag":434,"props":460,"children":462},{"id":461},"split-screen",[463],{"type":51,"value":412},{"type":46,"tag":47,"props":465,"children":466},{},[467,469,473,475,479],{"type":51,"value":468},"Split Screen is a useful feature to use multiple tabs at the same time. You can open it from ",{"type":46,"tag":363,"props":470,"children":471},{"className":40},[472],{"type":51,"value":439},{"type":51,"value":474}," or by clicking the ",{"type":46,"tag":363,"props":476,"children":477},{"className":40},[478],{"type":51,"value":390},{"type":51,"value":480}," in the top left corner of the DevTools and activate it from there.",{"type":46,"tag":434,"props":482,"children":484},{"id":483},"popup",[485],{"type":51,"value":418},{"type":46,"tag":47,"props":487,"children":488},{},[489,491,495],{"type":51,"value":490},"Popup is very useful for those who has a second screen, you can open it by clicking the ",{"type":46,"tag":363,"props":492,"children":493},{"className":40},[494],{"type":51,"value":390},{"type":51,"value":480},{"title":40,"searchDepth":497,"depth":497,"links":498},2,[499,500,501,502,503,504,505,506,507,508,509,510,511,512,513,514,515,516,517,518],{"id":67,"depth":497,"text":70},{"id":84,"depth":497,"text":87},{"id":99,"depth":497,"text":102},{"id":132,"depth":497,"text":135},{"id":147,"depth":497,"text":150},{"id":167,"depth":497,"text":170},{"id":183,"depth":497,"text":186},{"id":194,"depth":497,"text":197},{"id":205,"depth":497,"text":208},{"id":216,"depth":497,"text":219},{"id":227,"depth":497,"text":230},{"id":238,"depth":497,"text":241},{"id":249,"depth":497,"text":252},{"id":260,"depth":497,"text":263},{"id":283,"depth":497,"text":286},{"id":318,"depth":497,"text":321},{"id":333,"depth":497,"text":336},{"id":348,"depth":497,"text":351},{"id":376,"depth":497,"text":379},{"id":387,"depth":497,"text":390,"children":519},[520,522,523],{"id":436,"depth":521,"text":439},3,{"id":461,"depth":521,"text":412},{"id":483,"depth":521,"text":418},"markdown","content:1.guide:1.features.md","content","1.guide/1.features.md","md",[530,1273],{"_path":10,"_dir":38,"_draft":39,"_partial":39,"_locale":40,"title":9,"description":531,"body":532,"_type":524,"_id":1271,"_source":526,"_file":1272,"_extension":528},"Using Nuxt DevTools in your Nuxt project is only a command away.",{"type":43,"children":533,"toc":1262},[534,540,556,562,588,685,690,696,701,735,774,789,794,821,827,832,862,967,973,994,999,1065,1090,1096,1107,1243,1256],{"type":46,"tag":65,"props":535,"children":537},{"id":536},"installation",[538],{"type":51,"value":539},"Installation",{"type":46,"tag":541,"props":542,"children":543},"callout",{},[544],{"type":46,"tag":47,"props":545,"children":546},{},[547,549,555],{"type":51,"value":548},"Nuxt DevTools requires ",{"type":46,"tag":550,"props":551,"children":552},"strong",{},[553],{"type":51,"value":554},"Nuxt v3.1.0 or higher",{"type":51,"value":63},{"type":46,"tag":434,"props":557,"children":559},{"id":558},"auto-install",[560],{"type":51,"value":561},"Auto Install",{"type":46,"tag":47,"props":563,"children":564},{},[565,567,572,574,579,581,586],{"type":51,"value":566},"You just need to go to your ",{"type":46,"tag":363,"props":568,"children":569},{"className":40},[570],{"type":51,"value":571},"nuxt.config",{"type":51,"value":573}," file and set ",{"type":46,"tag":363,"props":575,"children":576},{"className":40},[577],{"type":51,"value":578},"devtools",{"type":51,"value":580}," to ",{"type":46,"tag":363,"props":582,"children":583},{"className":40},[584],{"type":51,"value":585},"true",{"type":51,"value":587},":",{"type":46,"tag":589,"props":590,"children":595},"pre",{"className":591,"code":592,"filename":593,"language":594,"meta":40,"style":40},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","export default defineNuxtConfig({\n  devtools: { enabled: true },\n})\n","nuxt.config.ts","ts",[596],{"type":46,"tag":363,"props":597,"children":598},{"__ignoreMap":40},[599,634,672],{"type":46,"tag":600,"props":601,"children":604},"span",{"class":602,"line":603},"line",1,[605,611,616,622,628],{"type":46,"tag":600,"props":606,"children":608},{"style":607},"--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF;--shiki-light-font-style:italic;--shiki-default-font-style:italic;--shiki-dark-font-style:italic",[609],{"type":51,"value":610},"export",{"type":46,"tag":600,"props":612,"children":613},{"style":607},[614],{"type":51,"value":615}," default",{"type":46,"tag":600,"props":617,"children":619},{"style":618},"--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF",[620],{"type":51,"value":621}," defineNuxtConfig",{"type":46,"tag":600,"props":623,"children":625},{"style":624},"--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8",[626],{"type":51,"value":627},"(",{"type":46,"tag":600,"props":629,"children":631},{"style":630},"--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF",[632],{"type":51,"value":633},"{\n",{"type":46,"tag":600,"props":635,"children":636},{"class":602,"line":497},[637,643,647,652,657,661,667],{"type":46,"tag":600,"props":638,"children":640},{"style":639},"--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178",[641],{"type":51,"value":642},"  devtools",{"type":46,"tag":600,"props":644,"children":645},{"style":630},[646],{"type":51,"value":587},{"type":46,"tag":600,"props":648,"children":649},{"style":630},[650],{"type":51,"value":651}," {",{"type":46,"tag":600,"props":653,"children":654},{"style":639},[655],{"type":51,"value":656}," enabled",{"type":46,"tag":600,"props":658,"children":659},{"style":630},[660],{"type":51,"value":587},{"type":46,"tag":600,"props":662,"children":664},{"style":663},"--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC",[665],{"type":51,"value":666}," true",{"type":46,"tag":600,"props":668,"children":669},{"style":630},[670],{"type":51,"value":671}," },\n",{"type":46,"tag":600,"props":673,"children":674},{"class":602,"line":521},[675,680],{"type":46,"tag":600,"props":676,"children":677},{"style":630},[678],{"type":51,"value":679},"}",{"type":46,"tag":600,"props":681,"children":682},{"style":624},[683],{"type":51,"value":684},")\n",{"type":46,"tag":47,"props":686,"children":687},{},[688],{"type":51,"value":689},"Nuxt will automatically install the DevTools module for you.",{"type":46,"tag":434,"props":691,"children":693},{"id":692},"install-using-nuxi",[694],{"type":51,"value":695},"Install using Nuxi",{"type":46,"tag":47,"props":697,"children":698},{},[699],{"type":51,"value":700},"You can opt-in Nuxt DevTools per-project by going to the project root and run:",{"type":46,"tag":589,"props":702,"children":706},{"className":703,"code":704,"language":705,"meta":40,"style":40},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","npx nuxi@latest devtools enable\n","bash",[707],{"type":46,"tag":363,"props":708,"children":709},{"__ignoreMap":40},[710],{"type":46,"tag":600,"props":711,"children":712},{"class":602,"line":603},[713,719,725,730],{"type":46,"tag":600,"props":714,"children":716},{"style":715},"--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B",[717],{"type":51,"value":718},"npx",{"type":46,"tag":600,"props":720,"children":722},{"style":721},"--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D",[723],{"type":51,"value":724}," nuxi@latest",{"type":46,"tag":600,"props":726,"children":727},{"style":721},[728],{"type":51,"value":729}," devtools",{"type":46,"tag":600,"props":731,"children":732},{"style":721},[733],{"type":51,"value":734}," enable\n",{"type":46,"tag":47,"props":736,"children":737},{},[738,740,746,748,753,755,760,761,766,767,772],{"type":51,"value":739},"Restart your Nuxt server and open your app in browser. Click the Nuxt icon on the bottom (or press ",{"type":46,"tag":741,"props":742,"children":743},"kbd",{},[744],{"type":51,"value":745},"Shift",{"type":51,"value":747}," + ",{"type":46,"tag":741,"props":749,"children":750},{},[751],{"type":51,"value":752},"Alt",{"type":51,"value":754}," / ",{"type":46,"tag":741,"props":756,"children":757},{},[758],{"type":51,"value":759},"⇧ Shift",{"type":51,"value":747},{"type":46,"tag":741,"props":762,"children":763},{},[764],{"type":51,"value":765},"⌥ Option",{"type":51,"value":747},{"type":46,"tag":741,"props":768,"children":769},{},[770],{"type":51,"value":771},"D",{"type":51,"value":773},") to toggle the DevTools.",{"type":46,"tag":541,"props":775,"children":776},{},[777],{"type":46,"tag":47,"props":778,"children":779},{},[780,782,787],{"type":51,"value":781},"If you using ",{"type":46,"tag":363,"props":783,"children":784},{"className":40},[785],{"type":51,"value":786},"nvm",{"type":51,"value":788}," or other Node version managers, we suggest to run the enable command again after switching Node version.",{"type":46,"tag":47,"props":790,"children":791},{},[792],{"type":51,"value":793},"Similarly, you can disable it per-project by running:",{"type":46,"tag":589,"props":795,"children":797},{"className":703,"code":796,"language":705,"meta":40,"style":40},"npx nuxi@latest devtools disable\n",[798],{"type":46,"tag":363,"props":799,"children":800},{"__ignoreMap":40},[801],{"type":46,"tag":600,"props":802,"children":803},{"class":602,"line":603},[804,808,812,816],{"type":46,"tag":600,"props":805,"children":806},{"style":715},[807],{"type":51,"value":718},{"type":46,"tag":600,"props":809,"children":810},{"style":721},[811],{"type":51,"value":724},{"type":46,"tag":600,"props":813,"children":814},{"style":721},[815],{"type":51,"value":729},{"type":46,"tag":600,"props":817,"children":818},{"style":721},[819],{"type":51,"value":820}," disable\n",{"type":46,"tag":434,"props":822,"children":824},{"id":823},"install-manually",[825],{"type":51,"value":826},"Install Manually",{"type":46,"tag":47,"props":828,"children":829},{},[830],{"type":51,"value":831},"Nuxt DevTools is currently provided as a module (might be changed in the future). If you prefer, you can also install it locally, which will be activated for all your team members.",{"type":46,"tag":589,"props":833,"children":835},{"className":703,"code":834,"language":705,"meta":40,"style":40},"npm i -D @nuxt/devtools\n",[836],{"type":46,"tag":363,"props":837,"children":838},{"__ignoreMap":40},[839],{"type":46,"tag":600,"props":840,"children":841},{"class":602,"line":603},[842,847,852,857],{"type":46,"tag":600,"props":843,"children":844},{"style":715},[845],{"type":51,"value":846},"npm",{"type":46,"tag":600,"props":848,"children":849},{"style":721},[850],{"type":51,"value":851}," i",{"type":46,"tag":600,"props":853,"children":854},{"style":721},[855],{"type":51,"value":856}," -D",{"type":46,"tag":600,"props":858,"children":859},{"style":721},[860],{"type":51,"value":861}," @nuxt/devtools\n",{"type":46,"tag":589,"props":863,"children":865},{"className":591,"code":864,"language":594,"meta":40,"style":40},"// nuxt.config.ts\nexport default defineNuxtConfig({\n  modules: [\n    '@nuxt/devtools',\n  ],\n})\n",[866],{"type":46,"tag":363,"props":867,"children":868},{"__ignoreMap":40},[869,878,901,918,942,955],{"type":46,"tag":600,"props":870,"children":871},{"class":602,"line":603},[872],{"type":46,"tag":600,"props":873,"children":875},{"style":874},"--shiki-light:#90A4AE;--shiki-default:#546E7A;--shiki-dark:#676E95;--shiki-light-font-style:italic;--shiki-default-font-style:italic;--shiki-dark-font-style:italic",[876],{"type":51,"value":877},"// nuxt.config.ts\n",{"type":46,"tag":600,"props":879,"children":880},{"class":602,"line":497},[881,885,889,893,897],{"type":46,"tag":600,"props":882,"children":883},{"style":607},[884],{"type":51,"value":610},{"type":46,"tag":600,"props":886,"children":887},{"style":607},[888],{"type":51,"value":615},{"type":46,"tag":600,"props":890,"children":891},{"style":618},[892],{"type":51,"value":621},{"type":46,"tag":600,"props":894,"children":895},{"style":624},[896],{"type":51,"value":627},{"type":46,"tag":600,"props":898,"children":899},{"style":630},[900],{"type":51,"value":633},{"type":46,"tag":600,"props":902,"children":903},{"class":602,"line":521},[904,909,913],{"type":46,"tag":600,"props":905,"children":906},{"style":639},[907],{"type":51,"value":908},"  modules",{"type":46,"tag":600,"props":910,"children":911},{"style":630},[912],{"type":51,"value":587},{"type":46,"tag":600,"props":914,"children":915},{"style":624},[916],{"type":51,"value":917}," [\n",{"type":46,"tag":600,"props":919,"children":921},{"class":602,"line":920},4,[922,927,932,937],{"type":46,"tag":600,"props":923,"children":924},{"style":630},[925],{"type":51,"value":926},"    '",{"type":46,"tag":600,"props":928,"children":929},{"style":721},[930],{"type":51,"value":931},"@nuxt/devtools",{"type":46,"tag":600,"props":933,"children":934},{"style":630},[935],{"type":51,"value":936},"'",{"type":46,"tag":600,"props":938,"children":939},{"style":630},[940],{"type":51,"value":941},",\n",{"type":46,"tag":600,"props":943,"children":945},{"class":602,"line":944},5,[946,951],{"type":46,"tag":600,"props":947,"children":948},{"style":624},[949],{"type":51,"value":950},"  ]",{"type":46,"tag":600,"props":952,"children":953},{"style":630},[954],{"type":51,"value":941},{"type":46,"tag":600,"props":956,"children":958},{"class":602,"line":957},6,[959,963],{"type":46,"tag":600,"props":960,"children":961},{"style":630},[962],{"type":51,"value":679},{"type":46,"tag":600,"props":964,"children":965},{"style":624},[966],{"type":51,"value":684},{"type":46,"tag":434,"props":968,"children":970},{"id":969},"edge-release-channel",[971],{"type":51,"value":972},"Edge Release Channel",{"type":46,"tag":47,"props":974,"children":975},{},[976,978,985,987,992],{"type":51,"value":977},"Similar to ",{"type":46,"tag":54,"props":979,"children":982},{"href":980,"rel":981},"https://nuxt.com/docs/guide/going-further/edge-channel#opting-into-the-edge-channel",[58],[983],{"type":51,"value":984},"Nuxt's Edge Channel",{"type":51,"value":986},", DevTools also offers an edge release channel, that automatically releases for every commit to ",{"type":46,"tag":363,"props":988,"children":989},{"className":40},[990],{"type":51,"value":991},"main",{"type":51,"value":993}," branch.",{"type":46,"tag":47,"props":995,"children":996},{},[997],{"type":51,"value":998},"You can opt-in to the edge release channel by running:",{"type":46,"tag":589,"props":1000,"children":1004},{"className":1001,"code":1002,"language":1003,"meta":40,"style":40},"language-diff shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","{\n  \"devDependencies\": {\n--    \"@nuxt/devtools\": \"^0.1.0\"\n++    \"@nuxt/devtools\": \"npm:@nuxt/devtools-edge@latest\"\n  }\n}\n","diff",[1005],{"type":46,"tag":363,"props":1006,"children":1007},{"__ignoreMap":40},[1008,1015,1023,1036,1049,1057],{"type":46,"tag":600,"props":1009,"children":1010},{"class":602,"line":603},[1011],{"type":46,"tag":600,"props":1012,"children":1013},{"style":624},[1014],{"type":51,"value":633},{"type":46,"tag":600,"props":1016,"children":1017},{"class":602,"line":497},[1018],{"type":46,"tag":600,"props":1019,"children":1020},{"style":624},[1021],{"type":51,"value":1022},"  \"devDependencies\": {\n",{"type":46,"tag":600,"props":1024,"children":1025},{"class":602,"line":521},[1026,1031],{"type":46,"tag":600,"props":1027,"children":1028},{"style":630},[1029],{"type":51,"value":1030},"-",{"type":46,"tag":600,"props":1032,"children":1033},{"style":639},[1034],{"type":51,"value":1035},"-    \"@nuxt/devtools\": \"^0.1.0\"\n",{"type":46,"tag":600,"props":1037,"children":1038},{"class":602,"line":920},[1039,1044],{"type":46,"tag":600,"props":1040,"children":1041},{"style":630},[1042],{"type":51,"value":1043},"+",{"type":46,"tag":600,"props":1045,"children":1046},{"style":721},[1047],{"type":51,"value":1048},"+    \"@nuxt/devtools\": \"npm:@nuxt/devtools-edge@latest\"\n",{"type":46,"tag":600,"props":1050,"children":1051},{"class":602,"line":944},[1052],{"type":46,"tag":600,"props":1053,"children":1054},{"style":624},[1055],{"type":51,"value":1056},"  }\n",{"type":46,"tag":600,"props":1058,"children":1059},{"class":602,"line":957},[1060],{"type":46,"tag":600,"props":1061,"children":1062},{"style":624},[1063],{"type":51,"value":1064},"}\n",{"type":46,"tag":47,"props":1066,"children":1067},{},[1068,1070,1075,1076,1081,1083,1088],{"type":51,"value":1069},"Remove lockfile (",{"type":46,"tag":363,"props":1071,"children":1072},{"className":40},[1073],{"type":51,"value":1074},"package-lock.json",{"type":51,"value":402},{"type":46,"tag":363,"props":1077,"children":1078},{"className":40},[1079],{"type":51,"value":1080},"yarn.lock",{"type":51,"value":1082},", or ",{"type":46,"tag":363,"props":1084,"children":1085},{"className":40},[1086],{"type":51,"value":1087},"pnpm-lock.yaml",{"type":51,"value":1089},") and reinstall dependencies.",{"type":46,"tag":434,"props":1091,"children":1093},{"id":1092},"module-options",[1094],{"type":51,"value":1095},"Module Options",{"type":46,"tag":47,"props":1097,"children":1098},{},[1099,1101,1105],{"type":51,"value":1100},"To configure Nuxt DevTools, you can pass the ",{"type":46,"tag":363,"props":1102,"children":1103},{"className":40},[1104],{"type":51,"value":578},{"type":51,"value":1106}," options.",{"type":46,"tag":589,"props":1108,"children":1110},{"className":591,"code":1109,"language":594,"meta":40,"style":40},"// nuxt.config.ts\nexport default defineNuxtConfig({\n  devtools: {\n    // Enable devtools (default: true)\n    enabled: true,\n    // VS Code Server options\n    vscode: {},\n    // ...other options\n  }\n})\n",[1111],{"type":46,"tag":363,"props":1112,"children":1113},{"__ignoreMap":40},[1114,1121,1144,1160,1168,1188,1196,1214,1223,1231],{"type":46,"tag":600,"props":1115,"children":1116},{"class":602,"line":603},[1117],{"type":46,"tag":600,"props":1118,"children":1119},{"style":874},[1120],{"type":51,"value":877},{"type":46,"tag":600,"props":1122,"children":1123},{"class":602,"line":497},[1124,1128,1132,1136,1140],{"type":46,"tag":600,"props":1125,"children":1126},{"style":607},[1127],{"type":51,"value":610},{"type":46,"tag":600,"props":1129,"children":1130},{"style":607},[1131],{"type":51,"value":615},{"type":46,"tag":600,"props":1133,"children":1134},{"style":618},[1135],{"type":51,"value":621},{"type":46,"tag":600,"props":1137,"children":1138},{"style":624},[1139],{"type":51,"value":627},{"type":46,"tag":600,"props":1141,"children":1142},{"style":630},[1143],{"type":51,"value":633},{"type":46,"tag":600,"props":1145,"children":1146},{"class":602,"line":521},[1147,1151,1155],{"type":46,"tag":600,"props":1148,"children":1149},{"style":639},[1150],{"type":51,"value":642},{"type":46,"tag":600,"props":1152,"children":1153},{"style":630},[1154],{"type":51,"value":587},{"type":46,"tag":600,"props":1156,"children":1157},{"style":630},[1158],{"type":51,"value":1159}," {\n",{"type":46,"tag":600,"props":1161,"children":1162},{"class":602,"line":920},[1163],{"type":46,"tag":600,"props":1164,"children":1165},{"style":874},[1166],{"type":51,"value":1167},"    // Enable devtools (default: true)\n",{"type":46,"tag":600,"props":1169,"children":1170},{"class":602,"line":944},[1171,1176,1180,1184],{"type":46,"tag":600,"props":1172,"children":1173},{"style":639},[1174],{"type":51,"value":1175},"    enabled",{"type":46,"tag":600,"props":1177,"children":1178},{"style":630},[1179],{"type":51,"value":587},{"type":46,"tag":600,"props":1181,"children":1182},{"style":663},[1183],{"type":51,"value":666},{"type":46,"tag":600,"props":1185,"children":1186},{"style":630},[1187],{"type":51,"value":941},{"type":46,"tag":600,"props":1189,"children":1190},{"class":602,"line":957},[1191],{"type":46,"tag":600,"props":1192,"children":1193},{"style":874},[1194],{"type":51,"value":1195},"    // VS Code Server options\n",{"type":46,"tag":600,"props":1197,"children":1199},{"class":602,"line":1198},7,[1200,1205,1209],{"type":46,"tag":600,"props":1201,"children":1202},{"style":639},[1203],{"type":51,"value":1204},"    vscode",{"type":46,"tag":600,"props":1206,"children":1207},{"style":630},[1208],{"type":51,"value":587},{"type":46,"tag":600,"props":1210,"children":1211},{"style":630},[1212],{"type":51,"value":1213}," {},\n",{"type":46,"tag":600,"props":1215,"children":1217},{"class":602,"line":1216},8,[1218],{"type":46,"tag":600,"props":1219,"children":1220},{"style":874},[1221],{"type":51,"value":1222},"    // ...other options\n",{"type":46,"tag":600,"props":1224,"children":1226},{"class":602,"line":1225},9,[1227],{"type":46,"tag":600,"props":1228,"children":1229},{"style":630},[1230],{"type":51,"value":1056},{"type":46,"tag":600,"props":1232,"children":1234},{"class":602,"line":1233},10,[1235,1239],{"type":46,"tag":600,"props":1236,"children":1237},{"style":630},[1238],{"type":51,"value":679},{"type":46,"tag":600,"props":1240,"children":1241},{"style":624},[1242],{"type":51,"value":684},{"type":46,"tag":47,"props":1244,"children":1245},{},[1246,1248,1255],{"type":51,"value":1247},"For all options available, please refer to TSDocs in your IDE, or the ",{"type":46,"tag":54,"props":1249,"children":1252},{"href":1250,"rel":1251},"https://github.com/nuxt/devtools/blob/main/packages/devtools-kit/src/_types/options.ts#L6",[58],[1253],{"type":51,"value":1254},"type definition file",{"type":51,"value":63},{"type":46,"tag":1257,"props":1258,"children":1259},"style",{},[1260],{"type":51,"value":1261},"html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":40,"searchDepth":497,"depth":497,"links":1263},[1264],{"id":536,"depth":497,"text":539,"children":1265},[1266,1267,1268,1269,1270],{"id":558,"depth":521,"text":561},{"id":692,"depth":521,"text":695},{"id":823,"depth":521,"text":826},{"id":969,"depth":521,"text":972},{"id":1092,"depth":521,"text":1095},"content:1.guide:0.getting-started.md","1.guide/0.getting-started.md",{"_path":16,"_dir":38,"_draft":39,"_partial":39,"_locale":40,"title":15,"description":1274,"body":1275,"_type":524,"_id":1593,"_source":526,"_file":1594,"_extension":528},"Open or control Nuxt DevTools with the useNuxtDevtools composable.",{"type":43,"children":1276,"toc":1591},[1277,1289,1529,1534,1582,1587],{"type":46,"tag":47,"props":1278,"children":1279},{},[1280,1282,1287],{"type":51,"value":1281},"In case you might want to open or control the Nuxt DevTools in your application on development, a composable ",{"type":46,"tag":363,"props":1283,"children":1284},{"className":40},[1285],{"type":51,"value":1286},"useNuxtDevtools",{"type":51,"value":1288}," is registered with auto-import.",{"type":46,"tag":589,"props":1290,"children":1294},{"className":1291,"code":1292,"language":1293,"meta":40,"style":40},"language-vue shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\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",[1295],{"type":46,"tag":363,"props":1296,"children":1297},{"__ignoreMap":40},[1298,1322,1330,1363,1379,1388,1404,1417,1444,1469,1477,1486,1495,1513],{"type":46,"tag":600,"props":1299,"children":1300},{"class":602,"line":603},[1301,1306,1311,1317],{"type":46,"tag":600,"props":1302,"children":1303},{"style":630},[1304],{"type":51,"value":1305},"\u003C",{"type":46,"tag":600,"props":1307,"children":1308},{"style":639},[1309],{"type":51,"value":1310},"script",{"type":46,"tag":600,"props":1312,"children":1314},{"style":1313},"--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA",[1315],{"type":51,"value":1316}," setup",{"type":46,"tag":600,"props":1318,"children":1319},{"style":630},[1320],{"type":51,"value":1321},">\n",{"type":46,"tag":600,"props":1323,"children":1324},{"class":602,"line":497},[1325],{"type":46,"tag":600,"props":1326,"children":1327},{"style":874},[1328],{"type":51,"value":1329},"// Returns undefined in production mode or when the DevTools are not enabled\n",{"type":46,"tag":600,"props":1331,"children":1332},{"class":602,"line":521},[1333,1338,1343,1348,1353,1358],{"type":46,"tag":600,"props":1334,"children":1335},{"style":1313},[1336],{"type":51,"value":1337},"const",{"type":46,"tag":600,"props":1339,"children":1340},{"style":624},[1341],{"type":51,"value":1342}," devtoolsClient ",{"type":46,"tag":600,"props":1344,"children":1345},{"style":630},[1346],{"type":51,"value":1347},"=",{"type":46,"tag":600,"props":1349,"children":1350},{"style":618},[1351],{"type":51,"value":1352}," useNuxtDevTools",{"type":46,"tag":600,"props":1354,"children":1355},{"style":624},[1356],{"type":51,"value":1357},"() ",{"type":46,"tag":600,"props":1359,"children":1360},{"style":874},[1361],{"type":51,"value":1362},"// NuxtDevToolsHostClient | undefined\n",{"type":46,"tag":600,"props":1364,"children":1365},{"class":602,"line":920},[1366,1371,1375],{"type":46,"tag":600,"props":1367,"children":1368},{"style":630},[1369],{"type":51,"value":1370},"\u003C/",{"type":46,"tag":600,"props":1372,"children":1373},{"style":639},[1374],{"type":51,"value":1310},{"type":46,"tag":600,"props":1376,"children":1377},{"style":630},[1378],{"type":51,"value":1321},{"type":46,"tag":600,"props":1380,"children":1381},{"class":602,"line":944},[1382],{"type":46,"tag":600,"props":1383,"children":1385},{"emptyLinePlaceholder":1384},true,[1386],{"type":51,"value":1387},"\n",{"type":46,"tag":600,"props":1389,"children":1390},{"class":602,"line":957},[1391,1395,1400],{"type":46,"tag":600,"props":1392,"children":1393},{"style":630},[1394],{"type":51,"value":1305},{"type":46,"tag":600,"props":1396,"children":1397},{"style":639},[1398],{"type":51,"value":1399},"template",{"type":46,"tag":600,"props":1401,"children":1402},{"style":630},[1403],{"type":51,"value":1321},{"type":46,"tag":600,"props":1405,"children":1406},{"class":602,"line":1198},[1407,1412],{"type":46,"tag":600,"props":1408,"children":1409},{"style":630},[1410],{"type":51,"value":1411},"  \u003C",{"type":46,"tag":600,"props":1413,"children":1414},{"style":639},[1415],{"type":51,"value":1416},"button\n",{"type":46,"tag":600,"props":1418,"children":1419},{"class":602,"line":1216},[1420,1425,1429,1434,1439],{"type":46,"tag":600,"props":1421,"children":1422},{"style":1313},[1423],{"type":51,"value":1424},"    v-if",{"type":46,"tag":600,"props":1426,"children":1427},{"style":630},[1428],{"type":51,"value":1347},{"type":46,"tag":600,"props":1430,"children":1431},{"style":630},[1432],{"type":51,"value":1433},"\"",{"type":46,"tag":600,"props":1435,"children":1436},{"style":721},[1437],{"type":51,"value":1438},"devtoolsClient",{"type":46,"tag":600,"props":1440,"children":1441},{"style":630},[1442],{"type":51,"value":1443},"\"\n",{"type":46,"tag":600,"props":1445,"children":1446},{"class":602,"line":1225},[1447,1452,1456,1460,1465],{"type":46,"tag":600,"props":1448,"children":1449},{"style":1313},[1450],{"type":51,"value":1451},"    @click",{"type":46,"tag":600,"props":1453,"children":1454},{"style":630},[1455],{"type":51,"value":1347},{"type":46,"tag":600,"props":1457,"children":1458},{"style":630},[1459],{"type":51,"value":1433},{"type":46,"tag":600,"props":1461,"children":1462},{"style":721},[1463],{"type":51,"value":1464},"devtoolsClient.devtools.navigate('/modules/components')",{"type":46,"tag":600,"props":1466,"children":1467},{"style":630},[1468],{"type":51,"value":1443},{"type":46,"tag":600,"props":1470,"children":1471},{"class":602,"line":1233},[1472],{"type":46,"tag":600,"props":1473,"children":1474},{"style":630},[1475],{"type":51,"value":1476},"  >\n",{"type":46,"tag":600,"props":1478,"children":1480},{"class":602,"line":1479},11,[1481],{"type":46,"tag":600,"props":1482,"children":1483},{"style":874},[1484],{"type":51,"value":1485},"    \u003C!-- Open the DevTools and navigate to the components tab -->\n",{"type":46,"tag":600,"props":1487,"children":1489},{"class":602,"line":1488},12,[1490],{"type":46,"tag":600,"props":1491,"children":1492},{"style":624},[1493],{"type":51,"value":1494},"    Open DevTools\n",{"type":46,"tag":600,"props":1496,"children":1498},{"class":602,"line":1497},13,[1499,1504,1509],{"type":46,"tag":600,"props":1500,"children":1501},{"style":630},[1502],{"type":51,"value":1503},"  \u003C/",{"type":46,"tag":600,"props":1505,"children":1506},{"style":639},[1507],{"type":51,"value":1508},"button",{"type":46,"tag":600,"props":1510,"children":1511},{"style":630},[1512],{"type":51,"value":1321},{"type":46,"tag":600,"props":1514,"children":1516},{"class":602,"line":1515},14,[1517,1521,1525],{"type":46,"tag":600,"props":1518,"children":1519},{"style":630},[1520],{"type":51,"value":1370},{"type":46,"tag":600,"props":1522,"children":1523},{"style":639},[1524],{"type":51,"value":1399},{"type":46,"tag":600,"props":1526,"children":1527},{"style":630},[1528],{"type":51,"value":1321},{"type":46,"tag":47,"props":1530,"children":1531},{},[1532],{"type":51,"value":1533},"When you have auto-import disabled, you can also import it explicitly:",{"type":46,"tag":589,"props":1535,"children":1537},{"className":591,"code":1536,"language":594,"meta":40,"style":40},"import { useNuxtDevTools } from '#imports'\n",[1538],{"type":46,"tag":363,"props":1539,"children":1540},{"__ignoreMap":40},[1541],{"type":46,"tag":600,"props":1542,"children":1543},{"class":602,"line":603},[1544,1549,1553,1557,1562,1567,1572,1577],{"type":46,"tag":600,"props":1545,"children":1546},{"style":607},[1547],{"type":51,"value":1548},"import",{"type":46,"tag":600,"props":1550,"children":1551},{"style":630},[1552],{"type":51,"value":651},{"type":46,"tag":600,"props":1554,"children":1555},{"style":624},[1556],{"type":51,"value":1352},{"type":46,"tag":600,"props":1558,"children":1559},{"style":630},[1560],{"type":51,"value":1561}," }",{"type":46,"tag":600,"props":1563,"children":1564},{"style":607},[1565],{"type":51,"value":1566}," from",{"type":46,"tag":600,"props":1568,"children":1569},{"style":630},[1570],{"type":51,"value":1571}," '",{"type":46,"tag":600,"props":1573,"children":1574},{"style":721},[1575],{"type":51,"value":1576},"#imports",{"type":46,"tag":600,"props":1578,"children":1579},{"style":630},[1580],{"type":51,"value":1581},"'\n",{"type":46,"tag":47,"props":1583,"children":1584},{},[1585],{"type":51,"value":1586},"Checkout it's type definition for more available methods.",{"type":46,"tag":1257,"props":1588,"children":1589},{},[1590],{"type":51,"value":1261},{"title":40,"searchDepth":497,"depth":497,"links":1592},[],"content:1.guide:2.composables.md","1.guide/2.composables.md",1702469255903]