201909
あたりに Next.js へ遷宮した自分のポータルサイト的なやつを Astro に書き換えた
next@13 で追加された
appDir
がまだ Static Export に対応していなかったのと、React も next も元々オーバーキル感が強くて微妙だとおもっていたので思い切って書き換えた
当時は SSG でイイ感じにパッケージングされてる選択肢が限られていて、消極的に next を採用したのもあり
最近はすっかり vite ばっかり使ってて、いける手応えが結構ある
Sveltekit か Qwik City あたりも検討したが、Svelte はやっぱり svelte のテンプレートの記法に抵抗感があるのと、Qwik はまだ1.0じゃないのもあるけどいろいろ不安定で変更も多いので
Astro は1.0出たし、テンプレートの記法はベター JSX といってよいと感じる
もちろん JSX はコンパイルすればピュアな JS に落ちるという利点があるとはおもうが、だから何？って最近はおもってきた
どうせ TypeScript で書くし、babel はもうほぼ使わんけど swc にせよなんらかのコンパイルは挟むわけなので、じゃあ多少のテンプレートは許容できるかなと
TIL
svg をインラインで読みたい:
frontmatter 部分に
const { default: innerHTML } = await import("some.svg?raw");
てな具合で import すると
innerHTML
には svg の中身が string として格納されるので、あとはこいつをテンプレートで参照すればよい
json の string を union に upcast したい:
json の特定の key には string の union として提供されている型の中身しか入ってないけど、それを表現する術がねえ....と困るのだが、
hoge as Foo
的な感じで
as
を使っても、string は
Foo
に upcast できないよ〜んと怒られてしまう
あまり good なプラクティスにはみえないけど
hoge as unknown as Foo
と一旦
unknown
に落としてやることで無理矢理 upcast できる
VSC でフォーマットされたい:
Astro の ext 入れたらイイ感じになるのかなとおもったら別途 prettier の設定をいれないとダメだった
jigsaw(ジグソウ、1991年6月12日-)は日本のプログラマ、会社代表。本名は小林貴也(こばやし たかや)。主にウェブ、フロントエンド領域で活動している。カミング・スーン合同会社の代表社員。