フロントエンドのテスト基盤を Jest から Vitest に移行した話
こんにちは。ナレッジワークの torii です。 7 月にフロントエンドエンジニアとして入社してもうすぐ半年、そろそろ技術記事の一つも書きたいなと思っていたところに、ちょうどいいネタを見つけたので投稿してみます！ Jest から Vitest に移行してみた 早速やったことですが、フロントエンドのテストフレームワークを Jest から Vitest に移行しました。理由としては、Jest が CJS を前提として動作しており、ESM 前提のモジュールを動かすのに一手間も二手間もかかるからです。 ナレッジワークのフロントエンドは Next.js を採用しており、テストフレームワークには Next.js と相性の良い Jest を採用していました。関数単位のテストや UI コンポーネントのテストを書く分には問題なかったのですが、それより上層（ページなど）になるとたちまち ESM 互換性の問題を
ViteとVitestで開発のリズムを上げる - エムスリーテックブログ
【Unit4 ブログリレー 1日目】 Viteは"ヴィート"と読みます♫ もう覚えましたね♫*1 こんにちは、エムスリーエンジニアリンググループの山田(@Satoki_1226)です。 本日より、Unit4でもブログリレーを行うこととなりました。Unit4は医療系ポータルサイト m3.com の開発・運営を担当するチームです。Unit4エンジニアがリレー形式でテックブログを執筆し、どんなメンバーがいるのか・どのような開発をしているのかなど、ご紹介できればと思います。 トップバッターである私からは、m3ラウンジというサービスのVite移行時に得られた知見をもとに、 Vite/Vitestへの移行によって感じた「速さ」 移行時の手順とポイント をお伝えできればと思います。Viteが気になっている方や、Vite移行の進め方に困っている方にとって少しでも参考になれば幸いです。なお掲載しているサンプ
Vite+Vitest+Ladleで快適フロントエンド開発 | 株式会社ヌーラボ(Nulab inc.)
SPAにするとNext.jsの嬉しさが半減しますが、/pages/以下のディレクトリ構造がそのままエンドポイントのパスに対応する、ディレクトリベースのルーティングをとても気に入っていたので、ほぼルーティングだけのためにNext.jsを使い続けていました。 今年（2023年）の春頃、高機能なNext.jsをルーティングのためだけに使いつづけるのはやはり違う気がする、と調べていて「ViteとReact Routerを使えば簡単にディレクトリベースのルーティングできるよ」という記事を見つけたのが、実はViteを知った最初でした。流行に鈍感…これが老化か…。 Simplifying Routing in React with Vite and File-based Routing Viteにはimport.meta.glob()という機能があり、トランスパイル時にディレクトリ以下のファイルを列挙し
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
