[{"data":1,"prerenderedAt":385},["ShallowReactive",2],{"navigation":3,"docs-/guide/getting-started":37},[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":10,"_dir":38,"_draft":39,"_partial":39,"_locale":40,"title":9,"description":41,"body":42,"_type":379,"_id":380,"_source":381,"_file":382,"_stem":383,"_extension":384},"guide",false,"","Using Nuxt DevTools in your Nuxt project is only a command away.",{"type":43,"children":44,"toc":367},"root",[45,54,72,79,109,122,127,133,138,148,154,193,209,214,222,228,233,241,249,255,279,284,294,323,329,341,349,362],{"type":46,"tag":47,"props":48,"children":50},"element","h2",{"id":49},"installation",[51],{"type":52,"value":53},"text","Installation",{"type":46,"tag":55,"props":56,"children":57},"callout",{},[58],{"type":46,"tag":59,"props":60,"children":61},"p",{},[62,64,70],{"type":52,"value":63},"Nuxt DevTools v2 requires ",{"type":46,"tag":65,"props":66,"children":67},"strong",{},[68],{"type":52,"value":69},"Nuxt v3.15.0 or higher",{"type":52,"value":71},".",{"type":46,"tag":73,"props":74,"children":76},"h3",{"id":75},"auto-install",[77],{"type":52,"value":78},"Auto Install",{"type":46,"tag":59,"props":80,"children":81},{},[82,84,91,93,99,101,107],{"type":52,"value":83},"You just need to go to your ",{"type":46,"tag":85,"props":86,"children":88},"code",{"className":87},[],[89],{"type":52,"value":90},"nuxt.config",{"type":52,"value":92}," file and set ",{"type":46,"tag":85,"props":94,"children":96},{"className":95},[],[97],{"type":52,"value":98},"devtools",{"type":52,"value":100}," to ",{"type":46,"tag":85,"props":102,"children":104},{"className":103},[],[105],{"type":52,"value":106},"true",{"type":52,"value":108},":",{"type":46,"tag":110,"props":111,"children":117},"pre",{"className":112,"code":113,"filename":114,"language":115,"meta":40,"style":116},"language-ts","export default defineNuxtConfig({\n  devtools: { enabled: true },\n})\n","nuxt.config.ts","ts","undefined",[118],{"type":46,"tag":85,"props":119,"children":120},{"__ignoreMap":40},[121],{"type":52,"value":113},{"type":46,"tag":59,"props":123,"children":124},{},[125],{"type":52,"value":126},"Nuxt will automatically install the DevTools module for you.",{"type":46,"tag":73,"props":128,"children":130},{"id":129},"install-using-nuxi",[131],{"type":52,"value":132},"Install using Nuxi",{"type":46,"tag":59,"props":134,"children":135},{},[136],{"type":52,"value":137},"You can opt-in Nuxt DevTools per-project by going to the project root and run:",{"type":46,"tag":110,"props":139,"children":143},{"className":140,"code":141,"language":142,"meta":40,"style":116},"language-bash","npx nuxi@latest devtools enable\n","bash",[144],{"type":46,"tag":85,"props":145,"children":146},{"__ignoreMap":40},[147],{"type":52,"value":141},{"type":46,"tag":73,"props":149,"children":151},{"id":150},"open-the-devtools-panel",[152],{"type":52,"value":153},"Open the DevTools Panel",{"type":46,"tag":59,"props":155,"children":156},{},[157,159,165,167,172,174,179,180,185,186,191],{"type":52,"value":158},"Restart your Nuxt server and open your app in browser. Click the Nuxt icon on the bottom (or press ",{"type":46,"tag":160,"props":161,"children":162},"kbd",{},[163],{"type":52,"value":164},"Shift",{"type":52,"value":166}," + ",{"type":46,"tag":160,"props":168,"children":169},{},[170],{"type":52,"value":171},"Alt",{"type":52,"value":173}," / ",{"type":46,"tag":160,"props":175,"children":176},{},[177],{"type":52,"value":178},"⇧ Shift",{"type":52,"value":166},{"type":46,"tag":160,"props":181,"children":182},{},[183],{"type":52,"value":184},"⌥ Option",{"type":52,"value":166},{"type":46,"tag":160,"props":187,"children":188},{},[189],{"type":52,"value":190},"D",{"type":52,"value":192},") to toggle the DevTools.",{"type":46,"tag":55,"props":194,"children":195},{},[196],{"type":46,"tag":59,"props":197,"children":198},{},[199,201,207],{"type":52,"value":200},"If you using ",{"type":46,"tag":85,"props":202,"children":204},{"className":203},[],[205],{"type":52,"value":206},"nvm",{"type":52,"value":208}," or other Node version managers, we suggest to run the enable command again after switching Node version.",{"type":46,"tag":59,"props":210,"children":211},{},[212],{"type":52,"value":213},"Similarly, you can disable it per-project by running:",{"type":46,"tag":110,"props":215,"children":217},{"className":140,"code":216,"language":142,"meta":40,"style":116},"npx nuxi@latest devtools disable\n",[218],{"type":46,"tag":85,"props":219,"children":220},{"__ignoreMap":40},[221],{"type":52,"value":216},{"type":46,"tag":73,"props":223,"children":225},{"id":224},"install-manually",[226],{"type":52,"value":227},"Install Manually",{"type":46,"tag":59,"props":229,"children":230},{},[231],{"type":52,"value":232},"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":110,"props":234,"children":236},{"className":140,"code":235,"language":142,"meta":40,"style":116},"npm i -D @nuxt/devtools\n",[237],{"type":46,"tag":85,"props":238,"children":239},{"__ignoreMap":40},[240],{"type":52,"value":235},{"type":46,"tag":110,"props":242,"children":244},{"className":112,"code":243,"filename":114,"language":115,"meta":40,"style":116},"export default defineNuxtConfig({\n  modules: [\n    '@nuxt/devtools',\n  ],\n})\n",[245],{"type":46,"tag":85,"props":246,"children":247},{"__ignoreMap":40},[248],{"type":52,"value":243},{"type":46,"tag":73,"props":250,"children":252},{"id":251},"nightly-release-channel",[253],{"type":52,"value":254},"Nightly Release Channel",{"type":46,"tag":59,"props":256,"children":257},{},[258,260,269,271,277],{"type":52,"value":259},"Similar to ",{"type":46,"tag":261,"props":262,"children":266},"a",{"href":263,"rel":264},"https://nuxt.com/docs/guide/going-further/nightly-release-channel",[265],"nofollow",[267],{"type":52,"value":268},"Nuxt's Nightly Channel",{"type":52,"value":270},", DevTools also offers a nightly release channel, that automatically releases for every commit to ",{"type":46,"tag":85,"props":272,"children":274},{"className":273},[],[275],{"type":52,"value":276},"main",{"type":52,"value":278}," branch.",{"type":46,"tag":59,"props":280,"children":281},{},[282],{"type":52,"value":283},"You can opt-in to the nightly release channel by running:",{"type":46,"tag":110,"props":285,"children":289},{"className":286,"code":287,"language":288,"meta":40,"style":116},"language-diff","{\n  \"devDependencies\": {\n--    \"@nuxt/devtools\": \"^0.1.0\"\n++    \"@nuxt/devtools\": \"npm:@nuxt/devtools-nightly@latest\"\n  }\n}\n","diff",[290],{"type":46,"tag":85,"props":291,"children":292},{"__ignoreMap":40},[293],{"type":52,"value":287},{"type":46,"tag":59,"props":295,"children":296},{},[297,299,305,307,313,315,321],{"type":52,"value":298},"Remove lockfile (",{"type":46,"tag":85,"props":300,"children":302},{"className":301},[],[303],{"type":52,"value":304},"package-lock.json",{"type":52,"value":306},", ",{"type":46,"tag":85,"props":308,"children":310},{"className":309},[],[311],{"type":52,"value":312},"yarn.lock",{"type":52,"value":314},", or ",{"type":46,"tag":85,"props":316,"children":318},{"className":317},[],[319],{"type":52,"value":320},"pnpm-lock.yaml",{"type":52,"value":322},") and reinstall dependencies.",{"type":46,"tag":73,"props":324,"children":326},{"id":325},"module-options",[327],{"type":52,"value":328},"Module Options",{"type":46,"tag":59,"props":330,"children":331},{},[332,334,339],{"type":52,"value":333},"To configure Nuxt DevTools, you can pass the ",{"type":46,"tag":85,"props":335,"children":337},{"className":336},[],[338],{"type":52,"value":98},{"type":52,"value":340}," options.",{"type":46,"tag":110,"props":342,"children":344},{"className":112,"code":343,"filename":114,"language":115,"meta":40,"style":116},"export 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",[345],{"type":46,"tag":85,"props":346,"children":347},{"__ignoreMap":40},[348],{"type":52,"value":343},{"type":46,"tag":59,"props":350,"children":351},{},[352,354,361],{"type":52,"value":353},"For all options available, please refer to TSDocs in your IDE, or the ",{"type":46,"tag":261,"props":355,"children":358},{"href":356,"rel":357},"https://github.com/nuxt/devtools/blob/main/packages/devtools-kit/src/_types/options.ts#L6",[265],[359],{"type":52,"value":360},"type definition file",{"type":52,"value":71},{"type":46,"tag":363,"props":364,"children":365},"style",{},[366],{"type":52,"value":40},{"title":40,"searchDepth":368,"depth":368,"links":369},2,[370],{"id":49,"depth":368,"text":53,"children":371},[372,374,375,376,377,378],{"id":75,"depth":373,"text":78},3,{"id":129,"depth":373,"text":132},{"id":150,"depth":373,"text":153},{"id":224,"depth":373,"text":227},{"id":251,"depth":373,"text":254},{"id":325,"depth":373,"text":328},"markdown","content:1.guide:0.getting-started.md","content","1.guide/0.getting-started.md","1.guide/0.getting-started","md",1787438931459]