[{"data":1,"prerenderedAt":773},["ShallowReactive",2],{"helpers-navigation":3,"mdc-o8y00b-key":32,"helpers-version":74,"\u002Fdocs\u002Fhelpers\u002Fvite":75,"\u002Fdocs\u002Fhelpers\u002Fvite-surround":770},[4],{"title":5,"path":6,"stem":7,"children":8,"icon":31},"Helpers","\u002Fdocs\u002Fhelpers","1.docs\u002F8.helpers\u002F1.index",[9,11,15,19,23,27],{"title":10,"path":6,"stem":7},"Getting Started",{"title":12,"path":13,"stem":14},"Environment Variables","\u002Fdocs\u002Fhelpers\u002Fenvironment-variables","1.docs\u002F8.helpers\u002F2.environment-variables",{"title":16,"path":17,"stem":18},"Meta Tags","\u002Fdocs\u002Fhelpers\u002Fmeta-tags","1.docs\u002F8.helpers\u002F3.meta-tags",{"title":20,"path":21,"stem":22},"Sitemap and robots.txt","\u002Fdocs\u002Fhelpers\u002Fsitemap","1.docs\u002F8.helpers\u002F4.sitemap",{"title":24,"path":25,"stem":26},"Redirects","\u002Fdocs\u002Fhelpers\u002Fredirects","1.docs\u002F8.helpers\u002F5.redirects",{"title":28,"path":29,"stem":30},"Vite","\u002Fdocs\u002Fhelpers\u002Fvite","1.docs\u002F8.helpers\u002F6.vite","i-ri-tools-line",{"data":33,"body":34},{},{"type":35,"children":36},"root",[37],{"type":38,"tag":39,"props":40,"children":41},"element","p",{},[42,45,54,56,63,65,72],{"type":43,"value":44},"text","Kirby Tools is built on ",{"type":38,"tag":46,"props":47,"children":51},"a",{"href":48,"rel":49},"https:\u002F\u002Fgetkirby.com",[50],"nofollow",[52],{"type":43,"value":53},"Kirby",{"type":43,"value":55}," – with gratitude to the team and community who make it. Help me improve the plugins: share feedback in ",{"type":38,"tag":46,"props":57,"children":60},{"href":58,"rel":59},"https:\u002F\u002Fgithub.com\u002Fkirby-tools\u002Fcommunity\u002Fdiscussions",[50],[61],{"type":43,"value":62},"Discussions",{"type":43,"value":64}," or report bugs via ",{"type":38,"tag":46,"props":66,"children":69},{"href":67,"rel":68},"https:\u002F\u002Fgithub.com\u002Fkirby-tools\u002Fcommunity\u002Fissues",[50],[70],{"type":43,"value":71},"Issues",{"type":43,"value":73},".",null,{"id":76,"title":28,"body":77,"description":764,"extension":765,"meta":766,"navigation":767,"path":29,"seo":768,"stem":30,"__hash__":769},"docs\u002F1.docs\u002F8.helpers\u002F6.vite.md",{"type":78,"value":79,"toc":758},"minimark",[80,96,101,126,149,294,316,320,335,389,393,396,453,467,533,542,614,617,626,630,653,745,754],[39,81,82,83,87,88,91,92,95],{},"The ",[84,85,86],"code",{},"vite()"," helper writes the ",[84,89,90],{},"\u003Cscript>"," and ",[84,93,94],{},"\u003Clink>"," tags for a Vite entry. It serves the files from the Vite dev server, with hot module replacement, until Vite's build manifest exists, and the built files from then on.",[97,98,100],"h2",{"id":99},"set-up-vite","Set Up Vite",[39,102,103,104,107,108,111,112,117,118,121,122,125],{},"Vite needs ",[84,105,106],{},"build.manifest: true"," and an entry file instead of ",[84,109,110],{},"index.html"," – see Vite's ",[46,113,116],{"href":114,"rel":115},"https:\u002F\u002Fvite.dev\u002Fguide\u002Fbackend-integration",[50],"backend integration guide",". When Kirby runs on a host other than ",[84,119,120],{},"localhost",", the dev server also needs that origin in ",[84,123,124],{},"server.cors.origin",", or the browser blocks its scripts.",[39,127,128,129,132,133,136,137,140,141,144,145,148],{},"Kirby Helpers looks for the manifest at ",[84,130,131],{},".vite\u002Fmanifest.json"," inside the ",[84,134,135],{},"vite.build.outDir"," folder, relative to Kirby's index root – the web root. The defaults match a Vite build into ",[84,138,139],{},"dist"," next to Kirby's ",[84,142,143],{},"index.php"," and a dev server on ",[84,146,147],{},"http:\u002F\u002Flocalhost:5173",":",[150,151,157],"pre",{"className":152,"code":153,"filename":154,"language":155,"meta":156,"style":156},"language-php shiki shiki-themes github-light github-light github-dark","return [\n    'johannschopplich.helpers' => [\n        'vite' => [\n            'server' => [\n                'host' => 'localhost',\n                'port' => 5173,\n                'https' => false\n            ],\n            'build' => [\n                'outDir' => 'dist'\n            ]\n        ]\n    ]\n];\n","site\u002Fconfig\u002Fconfig.php","php","",[84,158,159,172,184,194,204,218,232,243,249,259,270,276,282,288],{"__ignoreMap":156},[160,161,164,168],"span",{"class":162,"line":163},"line",1,[160,165,167],{"class":166},"s8jYJ","return",[160,169,171],{"class":170},"sxrX7"," [\n",[160,173,175,179,182],{"class":162,"line":174},2,[160,176,178],{"class":177},"sIIMD","    'johannschopplich.helpers'",[160,180,181],{"class":166}," =>",[160,183,171],{"class":170},[160,185,187,190,192],{"class":162,"line":186},3,[160,188,189],{"class":177},"        'vite'",[160,191,181],{"class":166},[160,193,171],{"class":170},[160,195,197,200,202],{"class":162,"line":196},4,[160,198,199],{"class":177},"            'server'",[160,201,181],{"class":166},[160,203,171],{"class":170},[160,205,207,210,212,215],{"class":162,"line":206},5,[160,208,209],{"class":177},"                'host'",[160,211,181],{"class":166},[160,213,214],{"class":177}," 'localhost'",[160,216,217],{"class":170},",\n",[160,219,221,224,226,230],{"class":162,"line":220},6,[160,222,223],{"class":177},"                'port'",[160,225,181],{"class":166},[160,227,229],{"class":228},"sBjJW"," 5173",[160,231,217],{"class":170},[160,233,235,238,240],{"class":162,"line":234},7,[160,236,237],{"class":177},"                'https'",[160,239,181],{"class":166},[160,241,242],{"class":228}," false\n",[160,244,246],{"class":162,"line":245},8,[160,247,248],{"class":170},"            ],\n",[160,250,252,255,257],{"class":162,"line":251},9,[160,253,254],{"class":177},"            'build'",[160,256,181],{"class":166},[160,258,171],{"class":170},[160,260,262,265,267],{"class":162,"line":261},10,[160,263,264],{"class":177},"                'outDir'",[160,266,181],{"class":166},[160,268,269],{"class":177}," 'dist'\n",[160,271,273],{"class":162,"line":272},11,[160,274,275],{"class":170},"            ]\n",[160,277,279],{"class":162,"line":278},12,[160,280,281],{"class":170},"        ]\n",[160,283,285],{"class":162,"line":284},13,[160,286,287],{"class":170},"    ]\n",[160,289,291],{"class":162,"line":290},14,[160,292,293],{"class":170},"];\n",[39,295,296,297,302,303,306,307,310,311,313,314,73],{},"In a ",[46,298,301],{"href":299,"rel":300},"https:\u002F\u002Fgetkirby.com\u002Fdocs\u002Fguide\u002Fconfiguration\u002Fcustom-folder-setup",[50],"public folder setup",", set Vite's ",[84,304,305],{},"build.outDir"," to ",[84,308,309],{},"public\u002Fdist"," and leave the plugin's ",[84,312,135],{}," at ",[84,315,139],{},[97,317,319],{"id":318},"development-and-production","Development and Production",[39,321,322,323,326,327,330,331,334],{},"Whether the manifest exists decides the mode, nothing else – ",[84,324,325],{},"vite()->isDev()"," returns ",[84,328,329],{},"true"," without one. A build left over from an earlier ",[84,332,333],{},"vite build"," keeps the site on the built files while the dev server runs, so delete it when you start the dev server:",[150,336,341],{"className":337,"code":338,"filename":339,"language":340,"meta":156,"style":156},"language-json shiki shiki-themes github-light github-light github-dark","{\n  \"scripts\": {\n    \"dev\": \"rm -rf dist && vite\",\n    \"build\": \"vite build\"\n  }\n}\n","package.json","json",[84,342,343,348,356,369,379,384],{"__ignoreMap":156},[160,344,345],{"class":162,"line":163},[160,346,347],{"class":170},"{\n",[160,349,350,353],{"class":162,"line":174},[160,351,352],{"class":228},"  \"scripts\"",[160,354,355],{"class":170},": {\n",[160,357,358,361,364,367],{"class":162,"line":186},[160,359,360],{"class":228},"    \"dev\"",[160,362,363],{"class":170},": ",[160,365,366],{"class":177},"\"rm -rf dist && vite\"",[160,368,217],{"class":170},[160,370,371,374,376],{"class":162,"line":196},[160,372,373],{"class":228},"    \"build\"",[160,375,363],{"class":170},[160,377,378],{"class":177},"\"vite build\"\n",[160,380,381],{"class":162,"line":206},[160,382,383],{"class":170},"  }\n",[160,385,386],{"class":162,"line":220},[160,387,388],{"class":170},"}\n",[97,390,392],{"id":391},"templates","Templates",[39,394,395],{},"Pass the entry as Vite names it in the manifest, its path from the Vite root:",[150,397,400],{"className":152,"code":398,"filename":399,"language":155,"meta":156,"style":156},"\u003C?= vite()->css('src\u002Fmain.js') ?>\n\u003C?= vite()->js('src\u002Fmain.js') ?>\n","site\u002Fsnippets\u002Fhead.php",[84,401,402,432],{"__ignoreMap":156},[160,403,404,407,411,414,417,420,423,426,429],{"class":162,"line":163},[160,405,406],{"class":166},"\u003C?=",[160,408,410],{"class":409},"snPdu"," vite",[160,412,413],{"class":170},"()",[160,415,416],{"class":166},"->",[160,418,419],{"class":409},"css",[160,421,422],{"class":170},"(",[160,424,425],{"class":177},"'src\u002Fmain.js'",[160,427,428],{"class":170},") ",[160,430,431],{"class":166},"?>\n",[160,433,434,436,438,440,442,445,447,449,451],{"class":162,"line":174},[160,435,406],{"class":166},[160,437,410],{"class":409},[160,439,413],{"class":170},[160,441,416],{"class":166},[160,443,444],{"class":409},"js",[160,446,422],{"class":170},[160,448,425],{"class":177},[160,450,428],{"class":170},[160,452,431],{"class":166},[39,454,455,456,326,459,462,463,466],{},"In development, ",[84,457,458],{},"css()",[84,460,461],{},"null"," – Vite injects the styles from JavaScript – and ",[84,464,465],{},"js()"," loads the Vite client before the entry:",[150,468,472],{"className":469,"code":470,"language":471,"meta":156,"style":156},"language-html shiki shiki-themes github-light github-light github-dark","\u003Cscript src=\"http:\u002F\u002Flocalhost:5173\u002F@vite\u002Fclient\" type=\"module\">\u003C\u002Fscript>\n\u003Cscript src=\"http:\u002F\u002Flocalhost:5173\u002Fsrc\u002Fmain.js\" type=\"module\">\u003C\u002Fscript>\n","html",[84,473,474,508],{"__ignoreMap":156},[160,475,476,479,483,486,489,492,495,497,500,503,505],{"class":162,"line":163},[160,477,478],{"class":170},"\u003C",[160,480,482],{"class":481},"sovSZ","script",[160,484,485],{"class":409}," src",[160,487,488],{"class":170},"=",[160,490,491],{"class":177},"\"http:\u002F\u002Flocalhost:5173\u002F@vite\u002Fclient\"",[160,493,494],{"class":409}," type",[160,496,488],{"class":170},[160,498,499],{"class":177},"\"module\"",[160,501,502],{"class":170},">\u003C\u002F",[160,504,482],{"class":481},[160,506,507],{"class":170},">\n",[160,509,510,512,514,516,518,521,523,525,527,529,531],{"class":162,"line":174},[160,511,478],{"class":170},[160,513,482],{"class":481},[160,515,485],{"class":409},[160,517,488],{"class":170},[160,519,520],{"class":177},"\"http:\u002F\u002Flocalhost:5173\u002Fsrc\u002Fmain.js\"",[160,522,494],{"class":409},[160,524,488],{"class":170},[160,526,499],{"class":177},[160,528,502],{"class":170},[160,530,482],{"class":481},[160,532,507],{"class":170},[39,534,535,536,538,539,541],{},"In production, ",[84,537,458],{}," links the entry's CSS and the CSS of every chunk it imports, and ",[84,540,465],{}," loads the built entry:",[150,543,545],{"className":469,"code":544,"language":471,"meta":156,"style":156},"\u003Clink\n  href=\"https:\u002F\u002Fexample.com\u002Fdist\u002Fassets\u002Fmain-BxE4l5kw.css\"\n  rel=\"stylesheet\"\n\u002F>\n\u003Cscript\n  src=\"https:\u002F\u002Fexample.com\u002Fdist\u002Fassets\u002Fmain-DiwrgTda.js\"\n  type=\"module\"\n>\u003C\u002Fscript>\n",[84,546,547,554,564,574,579,586,596,606],{"__ignoreMap":156},[160,548,549,551],{"class":162,"line":163},[160,550,478],{"class":170},[160,552,553],{"class":481},"link\n",[160,555,556,559,561],{"class":162,"line":174},[160,557,558],{"class":409},"  href",[160,560,488],{"class":170},[160,562,563],{"class":177},"\"https:\u002F\u002Fexample.com\u002Fdist\u002Fassets\u002Fmain-BxE4l5kw.css\"\n",[160,565,566,569,571],{"class":162,"line":186},[160,567,568],{"class":409},"  rel",[160,570,488],{"class":170},[160,572,573],{"class":177},"\"stylesheet\"\n",[160,575,576],{"class":162,"line":196},[160,577,578],{"class":170},"\u002F>\n",[160,580,581,583],{"class":162,"line":206},[160,582,478],{"class":170},[160,584,585],{"class":481},"script\n",[160,587,588,591,593],{"class":162,"line":220},[160,589,590],{"class":409},"  src",[160,592,488],{"class":170},[160,594,595],{"class":177},"\"https:\u002F\u002Fexample.com\u002Fdist\u002Fassets\u002Fmain-DiwrgTda.js\"\n",[160,597,598,601,603],{"class":162,"line":234},[160,599,600],{"class":409},"  type",[160,602,488],{"class":170},[160,604,605],{"class":177},"\"module\"\n",[160,607,608,610,612],{"class":162,"line":245},[160,609,502],{"class":170},[160,611,482],{"class":481},[160,613,507],{"class":170},[39,615,616],{},"The Vite client is added once per request, however many entries load. An entry missing from the manifest renders no tag in production, and no error.",[39,618,619,622,623,625],{},[84,620,621],{},"vite()->file('src\u002Fimages\u002Flogo.svg')"," returns the URL of a single file: the built file listed in the manifest, ",[84,624,461],{}," when it is not listed there, or the dev server URL in development.",[97,627,629],{"id":628},"panel","Panel",[39,631,632,91,635,638,639,91,642,645,646,648,649,652],{},[84,633,634],{},"panelJs()",[84,636,637],{},"panelCss()"," return the URLs for Kirby's ",[84,640,641],{},"panel.js",[84,643,644],{},"panel.css"," options, for one entry or an array of entries. ",[84,647,86],{}," needs a running Kirby, so call them in the ",[84,650,651],{},"ready"," callback:",[150,654,656],{"className":152,"code":655,"filename":154,"language":155,"meta":156,"style":156},"return [\n    'ready' => fn () => [\n        'panel' => [\n            'js' => vite()->panelJs('src\u002Fpanel.js'),\n            'css' => vite()->panelCss('src\u002Fpanel.js')\n        ]\n    ]\n];\n",[84,657,658,664,677,686,710,733,737,741],{"__ignoreMap":156},[160,659,660,662],{"class":162,"line":163},[160,661,167],{"class":166},[160,663,171],{"class":170},[160,665,666,669,671,674],{"class":162,"line":174},[160,667,668],{"class":177},"    'ready'",[160,670,181],{"class":166},[160,672,673],{"class":166}," fn",[160,675,676],{"class":170}," () => [\n",[160,678,679,682,684],{"class":162,"line":186},[160,680,681],{"class":177},"        'panel'",[160,683,181],{"class":166},[160,685,171],{"class":170},[160,687,688,691,693,695,697,699,702,704,707],{"class":162,"line":196},[160,689,690],{"class":177},"            'js'",[160,692,181],{"class":166},[160,694,410],{"class":409},[160,696,413],{"class":170},[160,698,416],{"class":166},[160,700,701],{"class":409},"panelJs",[160,703,422],{"class":170},[160,705,706],{"class":177},"'src\u002Fpanel.js'",[160,708,709],{"class":170},"),\n",[160,711,712,715,717,719,721,723,726,728,730],{"class":162,"line":206},[160,713,714],{"class":177},"            'css'",[160,716,181],{"class":166},[160,718,410],{"class":409},[160,720,413],{"class":170},[160,722,416],{"class":166},[160,724,725],{"class":409},"panelCss",[160,727,422],{"class":170},[160,729,706],{"class":177},[160,731,732],{"class":170},")\n",[160,734,735],{"class":162,"line":220},[160,736,281],{"class":170},[160,738,739],{"class":162,"line":234},[160,740,287],{"class":170},[160,742,743],{"class":162,"line":245},[160,744,293],{"class":170},[39,746,455,747,749,750,326,752,73],{},[84,748,634],{}," adds the Vite client and ",[84,751,637],{},[84,753,461],{},[755,756,757],"style",{},"html pre.shiki code .s8jYJ, html code.shiki .s8jYJ{--shiki-light:#D73A49;--shiki-default:#D73A49;--shiki-dark:#F97583}html pre.shiki code .sxrX7, html code.shiki .sxrX7{--shiki-light:#24292E;--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .sIIMD, html code.shiki .sIIMD{--shiki-light:#032F62;--shiki-default:#032F62;--shiki-dark:#9ECBFF}html pre.shiki code .sBjJW, html code.shiki .sBjJW{--shiki-light:#005CC5;--shiki-default:#005CC5;--shiki-dark:#79B8FF}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);}html pre.shiki code .snPdu, html code.shiki .snPdu{--shiki-light:#6F42C1;--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sovSZ, html code.shiki .sovSZ{--shiki-light:#22863A;--shiki-default:#22863A;--shiki-dark:#85E89D}",{"title":156,"searchDepth":174,"depth":174,"links":759},[760,761,762,763],{"id":99,"depth":174,"text":100},{"id":318,"depth":174,"text":319},{"id":391,"depth":174,"text":392},{"id":628,"depth":174,"text":629},"Load assets from the Vite dev server while it runs and the built, hashed files once a manifest exists – in templates and the Panel.","md",{},true,{"title":28,"description":764},"bBgFi6HWdNQrctadpHX7pJOdZE8gNi8YgBVyZlRXDY0",[771,74],{"title":24,"path":25,"stem":26,"description":772,"children":-1},"Send requests for URLs that no page or route answers to a new address, matched with Kirby route patterns.",1791534960268]