[{"data":1,"prerenderedAt":274},["ShallowReactive",2],{"navigation":3,"docs-\u002Fdevelopment\u002Fcontributing":52,"docs-\u002Fdevelopment\u002Fcontributing-surround":270},[4,22,43],{"title":5,"path":6,"stem":7,"children":8,"page":21},"Guide","\u002Fguide","1.guide",[9,13,17],{"title":10,"path":11,"stem":12},"Getting Started","\u002Fguide\u002Fgetting-started","1.guide\u002F0.getting-started",{"title":14,"path":15,"stem":16},"Features","\u002Fguide\u002Ffeatures","1.guide\u002F1.features",{"title":18,"path":19,"stem":20},"Composables","\u002Fguide\u002Fcomposables","1.guide\u002F2.composables",false,{"title":23,"path":24,"stem":25,"children":26,"page":21},"Module","\u002Fmodule","2.module",[27,31,35,39],{"title":28,"path":29,"stem":30},"Module Authors","\u002Fmodule\u002Fguide","2.module\u002F0.guide",{"title":32,"path":33,"stem":34},"Utility Kit","\u002Fmodule\u002Futils-kit","2.module\u002F1.utils-kit",{"title":36,"path":37,"stem":38},"UI Kit","\u002Fmodule\u002Fui-kit","2.module\u002F2.ui-kit",{"title":40,"path":41,"stem":42},"Migration to v4","\u002Fmodule\u002Fmigration-v4","2.module\u002F3.migration-v4",{"title":44,"path":45,"stem":46,"children":47,"page":21},"Development","\u002Fdevelopment","3.development",[48],{"title":49,"path":50,"stem":51},"Contribution Guide","\u002Fdevelopment\u002Fcontributing","3.development\u002F0.contributing",{"id":53,"title":49,"body":54,"description":264,"extension":265,"meta":266,"navigation":267,"path":50,"seo":268,"stem":51,"__hash__":269},"docs\u002F3.development\u002F0.contributing.md",{"type":55,"value":56,"toc":256},"minimark",[57,61,66,77,80,104,119,123,126,142,147,158,168,171,180,184,191,197,208,249,252],[58,59,60],"p",{},"Hi! We're really excited that you're interested in contributing to Nuxt DevTools! Before submitting your contribution, please read through the following guide.",[62,63,65],"h2",{"id":64},"monorepo","Monorepo",[58,67,68,69,76],{},"The Nuxt DevTools repo is a monorepo using pnpm workspaces. The package manager used to install and link dependencies must be ",[70,71,75],"a",{"href":72,"rel":73},"https:\u002F\u002Fpnpm.io\u002F",[74],"nofollow","pnpm",".",[58,78,79],{},"After cloning the repo, run in the root folder.",[81,82,87],"pre",{"className":83,"code":84,"language":85,"meta":86,"style":86},"language-sh shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","pnpm i\npnpm run build\n","sh","",[88,89,90,98],"code",{"__ignoreMap":86},[91,92,95],"span",{"class":93,"line":94},"line",1,[91,96,97],{},"pnpm i\n",[91,99,101],{"class":93,"line":100},2,[91,102,103],{},"pnpm run build\n",[105,106,107],"callout",{},[58,108,109,110,115,116,76],{},"Nuxt DevTools uses pnpm v8. If you are working on multiple projects with different versions of pnpm, it's recommended to enable ",[70,111,114],{"href":112,"rel":113},"https:\u002F\u002Fgithub.com\u002Fnodejs\u002Fcorepack",[74],"Corepack"," by running ",[88,117,118],{},"corepack enable",[62,120,122],{"id":121},"packages","Packages",[58,124,125],{},"This repo contains the following packages:",[127,128,129,136],"ul",{},[130,131,132,135],"li",{},[88,133,134],{},"@nuxt\u002Fdevtools",": The Nuxt DevTools module",[130,137,138,141],{},[88,139,140],{},"@nuxt\u002Fdevtools-ui-kit",": The UI Kit used by Nuxt DevTools and also for module authors to build UI for DevTools interation",[143,144,146],"h3",{"id":145},"devtools","DevTools",[58,148,149,150,153,154,157],{},"Most of the scripts are forward to the root ",[88,151,152],{},"package.json",". You can run ",[88,155,156],{},"pnpm dev"," in the root folder to start the development server (Nuxt DevTools on top of it's own client UI).",[58,159,160,161,164,165,167],{},"Or you can ",[88,162,163],{},"cd packages\u002Fdevtools"," and run ",[88,166,156],{}," to start the development server.",[143,169,36],{"id":170},"ui-kit",[58,172,173,174,164,177,179],{},"Normally when you are developing the Nuxt DevTools, the components in the UI Kit already get the HMR capabilities. But if you want to develop the UI Kit itself, you can run ",[88,175,176],{},"cd packages\u002Fdevtools-ui-kit",[88,178,156],{}," to start the playground for the UI Kit.",[62,181,183],{"id":182},"trying-local-changes","Trying Local Changes",[58,185,186,187,190],{},"If you want to try your local changes in other Nuxt projects, you can use the ",[88,188,189],{},"local.ts"," module under the root folder.",[58,192,193,194,196],{},"Change ",[88,195,134],{}," to the absolute path of this module in any of your Nuxt projects,\nallows you to try Nuxt DevTools locally directly from the source code. HMR is supported\nfor the front-end client.",[58,198,199,200,203,204,207],{},"For example, if you clone this repo to ",[88,201,202],{},"\u002Fusers\u002Fme\u002Fnuxt-devtools",", update your ",[88,205,206],{},"nuxt.config.ts",":",[81,209,213],{"className":210,"code":211,"filename":206,"language":212,"meta":86,"style":86},"language-diff shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","export default defineNuxtConfig({\n  modules: [\n-   '@nuxt\u002Fdevtools',\n+   '\u002Fusers\u002Fme\u002Fnuxt-devtools\u002Flocal',\n  ]\n})\n","diff",[88,214,215,220,225,231,237,243],{"__ignoreMap":86},[91,216,217],{"class":93,"line":94},[91,218,219],{},"export default defineNuxtConfig({\n",[91,221,222],{"class":93,"line":100},[91,223,224],{},"  modules: [\n",[91,226,228],{"class":93,"line":227},3,[91,229,230],{},"-   '@nuxt\u002Fdevtools',\n",[91,232,234],{"class":93,"line":233},4,[91,235,236],{},"+   '\u002Fusers\u002Fme\u002Fnuxt-devtools\u002Flocal',\n",[91,238,240],{"class":93,"line":239},5,[91,241,242],{},"  ]\n",[91,244,246],{"class":93,"line":245},6,[91,247,248],{},"})\n",[58,250,251],{},"On the module code, the source TypeScript file are directly used, so you don't need to build everytime. However, due to Node.js module caching, you need to restart your app to see the changes on the module side.",[253,254,255],"style",{},"html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":86,"searchDepth":100,"depth":100,"links":257},[258,259,263],{"id":64,"depth":100,"text":65},{"id":121,"depth":100,"text":122,"children":260},[261,262],{"id":145,"depth":227,"text":146},{"id":170,"depth":227,"text":36},{"id":182,"depth":100,"text":183},"Learn how to contribute to the Nuxt DevTools.","md",{},true,{"title":49,"description":264},"cLdXmwcYnsSVZTMLJegXbvnQ-FmAJKnUfBXCf_Y4Uf8",[271,273],{"title":40,"path":41,"stem":42,"description":272,"children":-1},"Breaking changes and migration guide for Nuxt DevTools v4.",null,1774568848203]