[{"data":1,"prerenderedAt":480},["ShallowReactive",2],{"navigation_docs":3,"-getting-started-directory-structure":81,"-getting-started-directory-structure-surround":475},[4,27,41,67],{"title":5,"icon":6,"path":7,"stem":8,"children":9,"page":26},"Getting Started","i-lucide-rocket","\u002Fgetting-started","1.getting-started",[10,14,18,22],{"title":11,"path":12,"stem":13},"Introduction","\u002Fgetting-started\u002Fintroduction","1.getting-started\u002F1.introduction",{"title":15,"path":16,"stem":17},"Installation","\u002Fgetting-started\u002Finstallation","1.getting-started\u002F2.installation",{"title":19,"path":20,"stem":21},"Configuration","\u002Fgetting-started\u002Fconfiguration","1.getting-started\u002F3.configuration",{"title":23,"path":24,"stem":25},"Directory Structure","\u002Fgetting-started\u002Fdirectory-structure","1.getting-started\u002F4.directory-structure",false,{"title":28,"icon":29,"path":30,"stem":31,"children":32,"page":26},"Routing","i-lucide-route","\u002Frouting","2.routing",[33,37],{"title":34,"path":35,"stem":36},"Parallel Routes","\u002Frouting\u002Fparallel-routes","2.routing\u002F1.parallel-routes",{"title":38,"path":39,"stem":40},"Modal Routes","\u002Frouting\u002Fmodal-routes","2.routing\u002F2.modal-routes",{"title":42,"icon":43,"path":44,"stem":45,"children":46,"page":26},"Components","i-lucide-blocks","\u002Fcomponents","3.components",[47,51,55,59,63],{"title":48,"path":49,"stem":50},"\u003CPlusParallelPage \u002F>","\u002Fcomponents\u002Fplus-parallel-page","3.components\u002F1.plus-parallel-page",{"title":52,"path":53,"stem":54},"\u003CPlusModalApp \u002F>","\u002Fcomponents\u002Fplus-modal-app","3.components\u002F2.plus-modal-app",{"title":56,"path":57,"stem":58},"\u003CPlusModalNuxtPage \u002F>","\u002Fcomponents\u002Fplus-modal-nuxt-page","3.components\u002F3.plus-modal-nuxt-page",{"title":60,"path":61,"stem":62},"\u003CPlusModalPage \u002F>","\u002Fcomponents\u002Fplus-modal-page","3.components\u002F4.plus-modal-page",{"title":64,"path":65,"stem":66},"\u003CPlusModalLink \u002F>","\u002Fcomponents\u002Fplus-modal-link","3.components\u002F5.plus-modal-link",{"title":68,"icon":69,"path":70,"stem":71,"children":72,"page":26},"API","i-lucide-braces","\u002Fapi","4.api",[73,77],{"title":74,"path":75,"stem":76},"Composables","\u002Fapi\u002Fcomposables","4.api\u002F2.composables",{"title":78,"path":79,"stem":80},"Interfaces","\u002Fapi\u002Finterfaces","4.api\u002F3.interfaces",{"id":82,"title":23,"body":83,"description":468,"extension":469,"links":470,"meta":471,"navigation":472,"path":24,"seo":473,"stem":25,"__hash__":474},"docs\u002F1.getting-started\u002F4.directory-structure.md",{"type":84,"value":85,"toc":461},"minimark",[86,91,100,131,250,255,258,348,356,362,367,374,457],[87,88,90],"h2",{"id":89},"named-parallel-routes","Named Parallel Routes",[92,93,94,95,99],"p",{},"You can place your parallel routes pages directory file with ",[96,97,98],"code",{},"{route}@{name}"," format.",[101,102,103,104,107,108,111,112,119,120,126,127,130],"warning",{},"Nuxt ",[96,105,106],{},">= 4.5"," parses ",[96,109,110],{},"{route}@{name}.vue"," files as ",[113,114,118],"a",{"href":115,"rel":116},"https:\u002F\u002Frouter.vuejs.org\u002Fguide\u002Fessentials\u002Fnamed-views.html",[117],"nofollow","vue-router named views",". To keep using them as parallel routes, enable the ",[113,121,123],{"href":122},"\u002Fgetting-started\u002Fconfiguration#namedviewsasparallelroutes",[96,124,125],{},"namedViewsAsParallelRoutes"," option in your config. Directory style routes like ",[96,128,129],{},"@foo\u002Findex.vue"," are not affected.",[132,133,134,153],"table",{},[135,136,137],"thead",{},[138,139,140,144,147,150],"tr",{},[141,142,143],"th",{},"File Path",[141,145,146],{},"Name",[141,148,149],{},"Generated route",[141,151,152],{},"Description",[154,155,156,177,194,212,231],"tbody",{},[138,157,158,164,169,174],{},[159,160,161],"td",{},[96,162,163],{},"index@foo.vue",[159,165,166],{},[96,167,168],{},"foo",[159,170,171],{},[96,172,173],{},"\u002F",[159,175,176],{},"name in index file",[138,178,179,183,187,191],{},[159,180,181],{},[96,182,129],{},[159,184,185],{},[96,186,168],{},[159,188,189],{},[96,190,173],{},[159,192,193],{},"name in root folder",[138,195,196,201,205,209],{},[159,197,198],{},[96,199,200],{},"@foo.vue",[159,202,203],{},[96,204,168],{},[159,206,207],{},[96,208,173],{},[159,210,211],{},"name in root folder without index",[138,213,214,219,223,228],{},[159,215,216],{},[96,217,218],{},"about\u002Fus@foo.vue",[159,220,221],{},[96,222,168],{},[159,224,225],{},[96,226,227],{},"\u002Fabout\u002Fus",[159,229,230],{},"name in file of folder",[138,232,233,238,242,247],{},[159,234,235],{},[96,236,237],{},"about\u002Fus@foo\u002Fcontact.vue",[159,239,240],{},[96,241,168],{},[159,243,244],{},[96,245,246],{},"\u002Fabout\u002Fus\u002Fcontact",[159,248,249],{},"name in sub folder",[251,252,254],"h3",{"id":253},"nested-named-parallel-routes","Nested Named Parallel Routes",[92,256,257],{},"Nuxt Pages Plus supports nested name file-based routing, which can be used in nested named parallel routes.",[132,259,260,272],{},[135,261,262],{},[138,263,264,266,268,270],{},[141,265,143],{},[141,267,146],{},[141,269,149],{},[141,271,152],{},[154,273,274,294,312,330],{},[138,275,276,281,286,291],{},[159,277,278],{},[96,279,280],{},"@foo\u002F@bar\u002Fabout.vue",[159,282,283],{},[96,284,285],{},"foo\u002Fbar",[159,287,288],{},[96,289,290],{},"\u002Fabout",[159,292,293],{},"nested name",[138,295,296,301,305,309],{},[159,297,298],{},[96,299,300],{},"about@foo\u002Fus@bar.vue",[159,302,303],{},[96,304,285],{},[159,306,307],{},[96,308,227],{},[159,310,311],{},"nested name in file and folder",[138,313,314,319,323,327],{},[159,315,316],{},[96,317,318],{},"@foo@bar\u002Fabout.vue",[159,320,321],{},[96,322,285],{},[159,324,325],{},[96,326,290],{},[159,328,329],{},"multiple nested name in folder",[138,331,332,337,341,345],{},[159,333,334],{},[96,335,336],{},"about\u002Fus@foo@bar.vue",[159,338,339],{},[96,340,285],{},[159,342,343],{},[96,344,227],{},[159,346,347],{},"multiple nested name in file",[251,349,351,352,355],{"id":350},"escape-separator","Escape ",[96,353,354],{},"@"," separator",[92,357,358,359,361],{},"Supporting named parallel views could lead to conflicts with certain routes, e.g. including the ",[96,360,354],{}," symbol in the route. Nuxt Pages Plus provided some options to address this problem.",[363,364,366],"h4",{"id":365},"customize-separator-symbol","Customize separator symbol",[92,368,369,370,373],{},"This allows you to use ",[96,371,372],{},"index+foo.vue"," as Parallel Routes.",[375,376,382],"pre",{"className":377,"code":378,"filename":379,"language":380,"meta":381,"style":381},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","export default defineNuxtConfig({\n  pagesPlus: {\n    separator: '+',\n  },\n})\n","nuxt.config.ts","ts","",[96,383,384,408,421,442,448],{"__ignoreMap":381},[385,386,389,393,396,400,404],"span",{"class":387,"line":388},"line",1,[385,390,392],{"class":391},"s7zQu","export",[385,394,395],{"class":391}," default",[385,397,399],{"class":398},"s2Zo4"," defineNuxtConfig",[385,401,403],{"class":402},"sTEyZ","(",[385,405,407],{"class":406},"sMK4o","{\n",[385,409,411,415,418],{"class":387,"line":410},2,[385,412,414],{"class":413},"swJcz","  pagesPlus",[385,416,417],{"class":406},":",[385,419,420],{"class":406}," {\n",[385,422,424,427,429,432,436,439],{"class":387,"line":423},3,[385,425,426],{"class":413},"    separator",[385,428,417],{"class":406},[385,430,431],{"class":406}," '",[385,433,435],{"class":434},"sfazB","+",[385,437,438],{"class":406},"'",[385,440,441],{"class":406},",\n",[385,443,445],{"class":387,"line":444},4,[385,446,447],{"class":406},"  },\n",[385,449,451,454],{"class":387,"line":450},5,[385,452,453],{"class":406},"}",[385,455,456],{"class":402},")\n",[458,459,460],"style",{},"html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}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":381,"searchDepth":410,"depth":410,"links":462},[463],{"id":89,"depth":410,"text":90,"children":464},[465,466],{"id":253,"depth":423,"text":254},{"id":350,"depth":423,"text":467},"Escape @ separator","All named parallel routes page files should be placed in the ~\u002Fpages\u002F directory. Nuxt Pages Plus will process these files and generate parallel routes after Nuxt has generated the routes.","md",null,{},true,{"title":23,"description":468},"cD6Ea7_DF6J89XWba0-Xw_THXoWV0NjxUc6OIeTIrTA",[476,478],{"title":19,"path":20,"stem":21,"description":477,"children":-1},"Nuxt Pages Plus provides a bunch of options to configure your parallel routes as you like in nuxt.config.",{"title":34,"path":35,"stem":36,"description":479,"children":-1},"Parallel Routes allows you to render multiple Nuxt pages within a single route, either synchronously or manually.",1790586689738]