Zenn
Closed2

deno で hono の jsx Middleware を使う設定

Deno
Hono
uttkuttk

deno で hono の jsx Middleware を使う場合は少し設定が必要。

deno.json
{
  "compilerOptions": {
    "jsx": "react-jsx",
    "jsxFragmentFactory": "Fragment",
    "jsxImportSource": "npm:hono@3.0.2/jsx" // hono をインポートする時のパスを指定
  }
}
uttkuttk

上記のように設定すると、jsx 関数をインポートしなくても jsx を使えるようになる👇

hello.tsx
import { serve } from "https://deno.land/std@0.167.0/http/server.ts";
import { Hono } from "npm:hono@3.0.2";

const app = new Hono();

app.get("/", (c) => {
  return c.html(
    <html>
      <body>
        <h1>Hello Hono!</h1>
      </body>
    </html>,
  );
});

serve(app.fetch);
このスクラップは2023/02/28にクローズされました