「実装例から見る React のテストの書き方」をアップデートする
社内の人から、自分が以前書いた次の記事が「便利で助かった！書いた時から何かアップデートある？」ってメッセージがきた。 そんな便利だなんてどうもありがとうございますウフフ、と思いながら書いた日を見てみると 2022-08-09 だった。もうすぐ 2 年経とうとしてる。時の流れが早くて怖い。 この記事に書かれた実装例はリポジトリにまとめていたんだけど、当然、何かメンテをしていたわけもなく、2022 年当時の状態がそのまま残っていた。 せっかく便利に思ってくれる人がいたので、内容をアップデートする。 アップデートまとめ メジャーバージョンのリリースやビルドツールの統一の観点で Jest から Vitest に移行 useFakeTimers({ shouldAdvanceTime: true }) @testing-library/reactを v15 にバージョンアップ MSW を v2 にバ
Prettier 3.0 をリリースしました
2023 年 7 月 5 日に Prettier 3.0 をリリースしました。Prettier 2.0 がリリースされたのが 2020 年 3 月 21 日だったので、実に 3 年以上ぶりのメジャーアップデートとなります。 本当はもっと早くこのブログを書きたかったんですが、やる気が出ずだいぶ遅れてしまいました。 この記事では Prettier 3.0 の主要な変更点を紹介します。 Prettier 3.0 の主要な変更点 Prettier 3.0 はメジャーアップデートということもあって大きな変更がいくつか含まれています。ここでは、そのうちユーザーに直接的な影響がありそうなものを紹介します。 ここで紹介する以外にも大きな変更はありますが、プラグイン開発者向けのものとか、Prettier のソースコード自体が全部 ECMAScript Modules で書かれるようになったとか、ユーザーから
Prettier 3.0: Hello, ECMAScript Modules! · Prettier
We are excited to announce the release of the new version of Prettier! We have made the migration to using ECMAScript Modules for all our source code. This change has significantly improved the development experience for the Prettier team. Please rest assured that when using Prettier as a library, you can still use it as CommonJS as well. This update comes with several breaking changes. One notabl
prettier-plugin-organize-imports で import 文を自動フォーマットする
これはなに 筆者は ES Modules ベースのコードの import 文を自動フォーマットするツールとして長らく prettier-plugin-organize-imports を愛用しています。一時期は ESLint でフォーマットしていましたが、試行錯誤の末にこのプラグインによるフォーマット方法に至りました。 本稿ではその導入手順をフォーマットの仕組みを軽く交えながら紹介します。 prettier-plugin-organize-imports の概要 TypeScript ( or JavaScript ) コードにある import 文を自動フォーマットする Prettier のプラグインです。ここでいうフォーマットは主に以下の 3 つの挙動を意味します。 import 文をアルファベット昇順でソート。 {} 内のモジュールもソートする。 冗長に書かれた import - i
Prettierはデフォルトでインデントのためにタブを使うべきなのだろうか
Prettier がデフォルトでインデントのためにタブを使うべきかどうか、現時点での私の考えです。 useTabs のデフォルト値を true にするという提案 Prettier には useTabs というオプションがあり、インデントのためにタブを使うかどうかを boolean で指定できます。デフォルトでは false が設定されています。 2 年ほど前に Prettier v2 の準備をしているときに Change useTabs to true by default という、useTabs のデフォルト値を true に設定することを提案する issue が作成されました。 この issue での議論は活発に行われ、建設的なコメントや逆に全く建設的でない人格を批判するようなコメントなど、実に多くの意見が寄せられました。 この issue が作成れたのは v2 をリリースする直前だっ
Prettier 2.8 はリリースしたくなかった
今日は軽めの話題で。 先日 Prettier 2.8 をリリースしました。 We just released Prettier 2.8. This release includes support for TypeScript 4.9 satisfies operator and improvements to the --cache CLI option!https://t.co/Yfs7Pd5MsD — Prettier (@PrettierCode) November 23, 2022 TypeScript 4.9 で追加された satisfies 演算子 のサポートや --cache オプションの改善が含まれていて、人によっては嬉しいんじゃないかと思います。 この Prettier 2.8 ですが、実はリリースするつもりはありませんでした。 というのも、本当は Prettier 2
Prettier 2.7 にキャッシュを実装した
Prettier 2.7 がリリースされました。 このバージョンには TypeScript 4.7 の対応のほかに、新しい CLI オプションである --cache と --cache-strategy が含まれています。 --cache と --cache-strategy を実装したのは自分なので、その背景や実装、そして使い方の話を雑にしようと思います。 背景 Rome Formatter のブログが公開されて日本の開発者からもそれなりに大きな反響がありました。 私個人としてはコードフォーマッターにそこまでの速さを求めていないのであんまり興味はなかった(もちろん速いほうがいいけど)のですが、みなさん意外と興味あるんだなあという気持ちで眺めていました。 それからしばらくして Prettier の https://github.com/prettier/prettier/issues/58
React+TSプロジェクトで便利だったLint/Format設定紹介
こんにちは、よしこです。 この記事は 2020年に立ち上げたWebフロントエンド構成の振り返り の「linter/formatter」項の詳細記事です。単体でも読めますが、よければ元記事もあわせてどうぞ！ この記事では、今わたしが 株式会社ナレッジワーク というスタートアップで開発・運用しているプロジェクトにおいて便利だったLint/Format関連の設定についてご紹介していきます。 使っているのは、TSのlintのためにESLint, CSSのlintのためにStylelint, 主なファイルのformatのためにPrettierです。 ESLint pluginsとextendsだけどんなもの入れてるか載せておきます。 "plugins": [ "strict-dependencies", // 後述 "unused-imports", // 後述 ], "extends": [ "a
ESLint と Prettier の共存設定とその根拠について
注意 この記事は 2020 年 09 月 24 日現在、古い情報となりました。 eslint-plugin-prettier の利用は非推奨であると公式がアナウンスを出しています。 そのことについては Prettier と ESLint の組み合わせの公式推奨が変わった にてまとめましたので、こちらもご覧ください。 また eslint-plugin-prettier は公式推奨ではなくなりましたが、それは Editor などの外部環境の進化によるものでこのプラグイン自体に何か問題が起きたわけではありません。 そして eslint-plugin-prettier を利用した設定方法、特に eslint-plugin-prettier と eslint-config-prettier が何を解決していたかを知らないと、prettier-eslint が何をどう解決したかを理解できないはずなので
Prettier 2.0 の主要な変更 - Qiita
ウェブ開発でよく使われているコードフォーマッターである Prettier の 2.0 がリリースされました。実装が間に合わず遅れている間に TypeScript 3.8 のリリースがあったりといろいろあり、当初の予定より 2 ヶ月ほど遅れてしまいました。 主要な変更について紹介します。詳細が知りたい方は、リリースブログや PR や Issue を確認してください。 Node 10.13.0 未満のサポート終了 https://github.com/prettier/prettier/pull/6907 https://github.com/prettier/prettier/pull/6908 https://github.com/prettier/prettier/pull/7302 EOL が来ているバージョンのサポートを終了します。 デフォルトオプションの変更 いくつかのオプションの
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
