mizdra.net
www.mizdra.net
VS Code でデバッガーを使って oxc の挙動を観察したい
oxc の挙動を観察したいな〜と突然思って、oxc のデバッグ環境を VS Code で用意した。ちょっと躓いたのでメモを残しておく。 やりたいこと oxc のテストを VS Code から実行したい しかも VS Code 上から breakpoint を設定して、テストをステップ実行したい Requirements 以下は事前にインストールしておく。 VS Code Rust rust-analyzer 拡張機能 rust-analyzer という Rust 向けの Language Server があって、それを VS Code から使うための拡張機能 VS Code からテストを実行す…
tsx と Node.js Type Stripping の違い
tsx は TypeScript コードを事前トランスパイルすることなく、直接 Node.js で実行するためのツール。 https://github.com/privatenumber/tsx ところで最近の Node.js には Type Stripping という機能が入った。これを使うと、tsx なしで TypeScript コードを事前トランスパイルせずに実行できる。 https://nodejs.org/api/typescript.html#type-stripping 両者の違い 一見すると両者は機能的に同じものかのように思うけど、実は結構違いがある。 import speci…
CSS Modules の拡張構文について
CSS Modules は、CSS をローカルスコープ化する仕組み。*.module.css に CSS を記述すると、bundler がクラスセレクターなどをユニークなものへと変換してくれる。クラスセレクターなどが *.module.css ファイルごとに異なる名前に変換され、擬似的にローカルスコープ化が実現される。 developer.hatenastaff.com CSS Modules では、基本的には CSS の標準の構文をそのまま利用する。しかし、一部 CSS Modules 独自の構文がある。実際どのようなものがあるのかというのを、紹介する。 CSS Modules の公式ドキュ…
TSKaigi 2025 に参加しました
色々セッションを聴いてきたので、その感想です。沢山ありすぎたので、聴いてて気になったものだけ感想書いてます。 The New Powerful ESLint Config with Type Safety https://talks.antfu.me/2025/tskaigi/1 ESLint の Flat Config についてのセッション。新 config への移行を補助するツール (@eslint/migrate-config, Config Inspector) が色々紹介されていた。存在そのものは知っていたけど、実際どういうことができるのかとか、動いている様子とかは見たことがなかった…
TSKaigi 2025 で CSS Modules Kit について発表しました
「TypeScript Language Service Plugin で CSS Modules の開発体験を改善する」というタイトルで発表しました。 speakerdeck.com CSS Modules には、Find All References などの言語機能が動かないといった問題があります。本発表では、その問題を解決するためのツールキット「CSS Modules Kit」を紹介しました。 github.com CSS Modules Kit は、Find All References といった主要なな言語機能をサポートしています。更に、VS Code 以外の様々なエディタで動くとい…
Next.js 14.0.0+ で Pages Router / basePath / Middleware 併用時に発生する不具合とその回避策について
社内のあるプロダクトで Next.js を v13 系から v15 系にアップデートしたところ、トップページにブラウザバックで戻ると、エラーが発生するようになってしまった。 エラーの原因を調べてみると、何故かトップページにブラウザバックで戻った時、pageProps が空オブジェクトになっているようだった。 不具合再現の様子。ブラウザバックでトップに戻ると、pageProps が空になる。 実はこれは Next.js の不具合で、以下に issue がある (まあ僕が報告したのだけど...)。 github.com Next.js 側で修正されるのを待ってたのだけど、不具合の報告から1年以上経…
RubyKaigi 2025 に参加した
同僚の id:onk さんや id:Pasta-K さんにぜひ来てほしいと誘われたので、参加してみました。普段は JavaScript ばかり書いてて 全く Ruby 書いたことないです。RubyKaigi 初参加です。せっかくなので感想を書いておきます。 プログラミング言語の話が多い 「RubyKaigi は Ruby の言語開発者が話すカンファレンスで、プログラミング言語の話ばかりしている」と事前に聞いていて心構えはしていたのですが、その想像の3倍はプログラミング言語の話をしていて驚きました。JIT の話、静的型の話、irb の話、ビルドシステムの話、パーサーの話、Linter の話、La…
4 ステップでモダンな tsconfig.json を作る
tsconfig.json を使うと、型チェックを緩く/強くしたり、また出力する JS の形式を変えたりできる。しかしいくつかの事情から、正しく書くのが難しい。 オプションの数が非常に多い その数なんと 133 個 *1 オプションの意味や役割が理解しにくい 公式ドキュメントは丁寧にかかれているが... JavaScript や TypeScript の仕様、型の知識、歴史的経緯などを知らないと理解しづらい 推奨されるオプションが変わっていく 言語やエコシステムの進化/変化によって変わる 最近だと Node.js の TypeScript サポートで変わった 「オプションの細かい意味とかは一旦…
株式会社はてなに入社しました
株式会社はてなに入社しました 株式会社はてなに入社しました - hitode909の日記
child_process で起動されたプロセスでは process.stdout の一部プロパティが欠けている
ターミナル向けに色付きの文字を format する関数を実装してて、そのテストを Vitest で書こうとしていた。 // src/format.ts function red(text: string): string { // ... } export function formatError(message: string): string { if (process.stderr.hasColors()) { return red('error: ') + message; } else { return 'error: ' + message; } } // src/format.t…