fix: 📌 Fixed sample code in Minimum SFC. (#280)

In the step for adding `option` to `generate`, it seemed necessary to add `option` to the arguments of `genNode` and `genElement` as well.

https://github.com/Ubugeeei/chibivue/blob/v0.0.8/book/impls/10_minimum_example/070_sfc_compiler3/packages/compiler-core/codegen.ts

Therefore, `genNode` and `genElement` with added arguments were also added to the sample code.

> 一時的な対応なのであまり厳格ではないのですが、概ね動作するようになると思います。
>
> ```ts
> export const generate = (
>   {
>     children,
>   }: {
>     children: TemplateChildNode[]
>   },
>   option: Required<CompilerOptions>,
> ): string => {
>   // isBrowser が false の場合は with 文を含まないコードを生成する
>   return `${option.isBrowser ? 'return ' : ''}function render(_ctx) {
>     ${option.isBrowser ? 'with (_ctx) {' : ''}
>       const { h } = ChibiVue;
>       return ${genNode(children[0], option)};
>     ${option.isBrowser ? '}' : ''}
> }`
> }
>
> // .
> // .
> // .
>
> const genProp = (
>   prop: AttributeNode | DirectiveNode,
>   option: Required<CompilerOptions>,
> ): string => {
>   switch (prop.type) {
>     case NodeTypes.ATTRIBUTE:
>       return `${prop.name}: "${prop.value?.content}"`
>     case NodeTypes.DIRECTIVE: {
>       switch (prop.name) {
>         case 'on':
>           return `${toHandlerKey(prop.arg)}: ${
>             option.isBrowser ? '' : '_ctx.' // -------------------- ここ
>           }${prop.exp}`
>         default:
>           // TODO: other directives
>           throw new Error(`unexpected directive name. got "${prop.name}"`)
>       }
>     }
>     default:
>       throw new Error(`unexpected prop type.`)
>   }
> }
>
> // .
> // .
> // .
>
> const genInterpolation = (
>   node: InterpolationNode,
>   option: Required<CompilerOptions>,
> ): string => {
>   return `${option.isBrowser ? '' : '_ctx.'}${node.content}` // ------------ ここ
> }
> ```
>
> https://ubugeeei.github.io/chibivue/10-minimum-example/090-minimum-sfc.html#template-%E9%83%A8%E5%88%86%E3%81%AE%E3%82%B3%E3%83%B3%E3%83%8F%E3%82%9A%E3%82%A4%E3%83%AB

book/online-book/src/10-minimum-example/090-minimum-sfc.md

@@ -793,6 +793,31 @@ export const generate = (
 // .
 // .
 
+const genNode = (
+ node: TemplateChildNode,
+ option: Required<CompilerOptions>,
+): string => {
+ switch (node.type) {
+ case NodeTypes.ELEMENT:
+ return genElement(node, option)
+ case NodeTypes.TEXT:
+ return genText(node)
+ case NodeTypes.INTERPOLATION:
+ return genInterpolation(node, option)
+ default:
+ return ''
+ }
+}
+
+const genElement = (
+ el: ElementNode,
+ option: Required<CompilerOptions>,
+): string => {
+ return `h("${el.tag}", {${el.props
+ .map(prop => genProp(prop, option))
+ .join(', ')}}, [${el.children.map(it => genNode(it, option)).join(', ')}])`
+}
+
 const genProp = (
  prop: AttributeNode | DirectiveNode,
  option: Required<CompilerOptions>,

book/online-book/src/en/10-minimum-example/090-minimum-sfc.md

@@ -783,6 +783,31 @@ export const generate = (
 // .
 // .
 
+const genNode = (
+ node: TemplateChildNode,
+ option: Required<CompilerOptions>,
+): string => {
+ switch (node.type) {
+ case NodeTypes.ELEMENT:
+ return genElement(node, option)
+ case NodeTypes.TEXT:
+ return genText(node)
+ case NodeTypes.INTERPOLATION:
+ return genInterpolation(node, option)
+ default:
+ return ''
+ }
+}
+
+const genElement = (
+ el: ElementNode,
+ option: Required<CompilerOptions>,
+): string => {
+ return `h("${el.tag}", {${el.props
+ .map(prop => genProp(prop, option))
+ .join(', ')}}, [${el.children.map(it => genNode(it, option)).join(', ')}])`
+}
+
 const genProp = (
  prop: AttributeNode | DirectiveNode,
  option: Required<CompilerOptions>,