[{"data":1,"prerenderedAt":460},["ShallowReactive",2],{"content-ja-\u002Fsyntax\u002Fincludes":3},{"id":4,"title":5,"body":6,"description":453,"extension":454,"meta":455,"navigation":235,"path":456,"seo":457,"stem":458,"__hash__":459},"content_ja\u002Fsyntax\u002Fincludes.md","include と component",{"type":7,"value":8,"toc":440},"minimark",[9,13,17,21,62,64,76,117,126,128,134,138,158,161,170,179,183,189,243,246,343,347,350,386,389,403,406,436],[10,11,5],"h1",{"id":12},"include-と-component",[14,15,16],"p",{},"他の Markdown ファイルを取り込んで再利用できます。",[18,19,20],"h2",{"id":20},"使い分け",[22,23,24,37],"table",{},[25,26,27],"thead",{},[28,29,30,34],"tr",{},[31,32,33],"th",{},"構文",[31,35,36],{},"いつ使うか",[38,39,40,52],"tbody",{},[28,41,42,49],{},[43,44,45],"td",{},[46,47,48],"strong",{},"include",[43,50,51],{},"props が不要な単純な取り込み",[28,53,54,59],{},[43,55,56],{},[46,57,58],{},"component",[43,60,61],{},"props で差し込みたい、呼び出し側から値を渡したい",[18,63,48],{"id":48},[14,65,66,67,71,72,75],{},"指定した ",[68,69,70],"code",{},".md"," ファイルを読み込み、その位置に展開します。props はありません。親スコープのテンプレート変数は ",[46,73,74],{},"見えます","。",[77,78,83],"pre",{"className":79,"code":80,"language":81,"meta":82,"style":82},"language-markdown shiki shiki-themes github-light github-dark","\u003C!--\n@hg\ninclude .\u002Fcomponents\u002Fdescription.md\n@endhg\n-->\n","markdown","",[68,84,85,93,99,105,111],{"__ignoreMap":82},[86,87,90],"span",{"class":88,"line":89},"line",1,[86,91,92],{},"\u003C!--\n",[86,94,96],{"class":88,"line":95},2,[86,97,98],{},"@hg\n",[86,100,102],{"class":88,"line":101},3,[86,103,104],{},"include .\u002Fcomponents\u002Fdescription.md\n",[86,106,108],{"class":88,"line":107},4,[86,109,110],{},"@endhg\n",[86,112,114],{"class":88,"line":113},5,[86,115,116],{},"-->\n",[14,118,119,120,125],{},"ファイルが見つからない場合は ",[46,121,122],{},[68,123,124],{},"file_not_found"," エラーで中断します。",[18,127,58],{"id":58},[14,129,130,131,133],{},"props を持つ ",[68,132,70],{}," ファイルを関数のように呼び出せます。",[135,136,137],"h3",{"id":137},"定義",[77,139,141],{"className":79,"code":140,"language":81,"meta":82,"style":82},"\u003C!--@hg\ncomponent city-item.md as cityItem\n@endhg-->\n",[68,142,143,148,153],{"__ignoreMap":82},[86,144,145],{"class":88,"line":89},[86,146,147],{},"\u003C!--@hg\n",[86,149,150],{"class":88,"line":95},[86,151,152],{},"component city-item.md as cityItem\n",[86,154,155],{"class":88,"line":101},[86,156,157],{},"@endhg-->\n",[135,159,160],{"id":160},"呼び出し",[14,162,163,169],{},[46,164,165,168],{},[68,166,167],{},"{{ }}"," 内のみ","で呼び出します。",[77,171,173],{"className":79,"code":172,"language":81,"meta":82,"style":82},"- {{ cityItem({ city: \"Osaka\", population: 2825000 }) }}\n",[68,174,175],{"__ignoreMap":82},[86,176,177],{"class":88,"line":89},[86,178,172],{},[135,180,182],{"id":181},"component-ファイルの例","component ファイルの例",[14,184,185,188],{},[68,186,187],{},"city-item.md",":",[77,190,192],{"className":79,"code":191,"language":81,"meta":82,"style":82},"---\nprops:\n  city:\n    type: string\n  population:\n    type: number\n---\n\nName: {{ city }} \u002F Population: {{ population.toLocaleString('ja-JP') }}\n",[68,193,194,199,204,209,214,219,225,230,237],{"__ignoreMap":82},[86,195,196],{"class":88,"line":89},[86,197,198],{},"---\n",[86,200,201],{"class":88,"line":95},[86,202,203],{},"props:\n",[86,205,206],{"class":88,"line":101},[86,207,208],{},"  city:\n",[86,210,211],{"class":88,"line":107},[86,212,213],{},"    type: string\n",[86,215,216],{"class":88,"line":113},[86,217,218],{},"  population:\n",[86,220,222],{"class":88,"line":221},6,[86,223,224],{},"    type: number\n",[86,226,228],{"class":88,"line":227},7,[86,229,198],{},[86,231,233],{"class":88,"line":232},8,[86,234,236],{"emptyLinePlaceholder":235},true,"\n",[86,238,240],{"class":88,"line":239},9,[86,241,242],{},"Name: {{ city }} \u002F Population: {{ population.toLocaleString('ja-JP') }}\n",[135,244,245],{"id":245},"ルール",[22,247,248,258],{},[25,249,250],{},[28,251,252,255],{},[31,253,254],{},"項目",[31,256,257],{},"内容",[38,259,260,273,281,292,305,316,331],{},[28,261,262,264],{},[43,263,137],{},[43,265,266,269,270],{},[68,267,268],{},"@hg"," 内で ",[68,271,272],{},"component \u003Cpath> as \u003Cname>",[28,274,275,277],{},[43,276,160],{},[43,278,279,168],{},[68,280,167],{},[28,282,283,289],{},[43,284,285,288],{},[68,286,287],{},"as"," のスコープ",[43,290,291],{},"定義したファイルだけでなく、include 先からも見える",[28,293,294,299],{},[43,295,296,298],{},[68,297,287],{}," 名の衝突",[43,300,301,304],{},[46,302,303],{},"エラー","（後勝ちにしない）",[28,306,307,310],{},[43,308,309],{},"戻り値",[43,311,312,313,315],{},"レンダリング結果を ",[68,314,167],{}," に埋め込む",[28,317,318,321],{},[43,319,320],{},"出力行数",[43,322,323,326,327,330],{},[46,324,325],{},"単一行のみ","（改行を含むと ",[68,328,329],{},"component_multiline_output"," エラー）",[28,332,333,336],{},[43,334,335],{},"extend",[43,337,338,339,342],{},"component 内では ",[46,340,341],{},"不可","（スキップ + 警告）",[135,344,346],{"id":345},"each-内での呼び出し","each 内での呼び出し",[14,348,349],{},"ループ変数を props に渡せます。",[77,351,353],{"className":79,"code":352,"language":81,"meta":82,"style":82},"\u003C!--@hg\neach item in cities\n@endhg-->\n- {{ cityItem({ city: item.name, population: item.population }) }}\n\u003C!--@hg\nendeach\n@endhg-->\n",[68,354,355,359,364,368,373,377,382],{"__ignoreMap":82},[86,356,357],{"class":88,"line":89},[86,358,147],{},[86,360,361],{"class":88,"line":95},[86,362,363],{},"each item in cities\n",[86,365,366],{"class":88,"line":101},[86,367,157],{},[86,369,370],{"class":88,"line":107},[86,371,372],{},"- {{ cityItem({ city: item.name, population: item.population }) }}\n",[86,374,375],{"class":88,"line":113},[86,376,147],{},[86,378,379],{"class":88,"line":221},[86,380,381],{},"endeach\n",[86,383,384],{"class":88,"line":227},[86,385,157],{},[18,387,388],{"id":388},"循環参照",[14,390,391,393,394,393,396,398,399,402],{},[68,392,48],{}," \u002F ",[68,395,58],{},[68,397,335],{}," の循環を検出した場合、当該取り込みを ",[46,400,401],{},"スキップし警告","します（エラーではありません）。",[18,404,405],{"id":405},"関連",[407,408,409,418,430],"ul",{},[410,411,412,417],"li",{},[413,414,416],"a",{"href":415},"\u002Fja\u002Fsyntax\u002Ffront-matter","Front matter"," — props 契約",[410,419,420,424,425,393,427],{},[413,421,423],{"href":422},"\u002Fja\u002Fsyntax\u002Fcontrol-flow","制御構造"," — ",[68,426,335],{},[68,428,429],{},"block",[410,431,432],{},[413,433,435],{"href":434},"\u002Fja\u002Fsyntax\u002Fpaths-and-security","パスとセキュリティ",[437,438,439],"style",{},"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":82,"searchDepth":95,"depth":95,"links":441},[442,443,444,451,452],{"id":20,"depth":95,"text":20},{"id":48,"depth":95,"text":48},{"id":58,"depth":95,"text":58,"children":445},[446,447,448,449,450],{"id":137,"depth":101,"text":137},{"id":160,"depth":101,"text":160},{"id":181,"depth":101,"text":182},{"id":245,"depth":101,"text":245},{"id":345,"depth":101,"text":346},{"id":388,"depth":95,"text":388},{"id":405,"depth":95,"text":405},"ファイルの取り込みと component による再利用","md",{},"\u002Fsyntax\u002Fincludes",{"title":5,"description":453},"syntax\u002Fincludes","zSCpAikPMYUJLGINYwMtWuSYM_73ydweNN7jsWSJV_k",1787223114971]