【翻訳】Prettier を Rust で書き換えたプロジェクトに $20k の報奨金を支払うプログラムは Biome が勝ちました
この記事は vjeux 氏によって Prettier 公式ブログに投稿された「$20k Bounty was Claimed!」を許可をもらって翻訳したものです。 もとのタイトルを翻訳するのが難しかったので、できるだけわかりやすいものに翻訳しました。 PrettierというJavaScriptのコードフォーマッターは、人々がコードを書く様々な方法を慎重に扱うことで、驚くほど広く採用されています。この時点で、フォーマットロジックは安定しており、私たちの三項演算子に関する作業が完了すれば、それは満足のいく状態になるでしょう。 これは、次の重要な側面に注目できるということを意味します：パフォーマンス。Prettierは決して速いとは言えませんが、ほとんどの使用例には十分な速さです。これはいつも不満足な感じがしたので、何かをすることを望んでいました。それには、友好的な競争以上の方法はありません。
VS Code Prettier拡張でPretteir v2/v3両対応を試みる
この拡張には現在 (2023/07/30 9.19.0 時点) はまだPrettier v2が同梱されている。同梱をv3に変更するPRはまだマージされていない（と書いてたらさっきマージされた）。 ただ、この拡張は対象ワークスペースのプロジェクトのローカルにprettierがインストールされていればそっちを使ってくれるので、この拡張の変更のリリースを待たずとも、単にプロジェクトでprettierをアップデートすればVS Codeでもv3が使われて期待通り動くはず。 が、結果は予想に反して、v3で動いているはずなのにtrailingCommaがallではなく、v2相当のes5で動いてしまってた。あれ？ 原因は、この拡張は拡張側でPrettierのデフォルト設定を独自に持ってしまっていて、プロジェクトに設定ファイルprettierrcが無い場合は拡張側のデフォルト設定が使われるから。Pretti
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でimportの順番を自動で整理する
背景 フロントエンドPJのimport文は、複数のモジュールをインポートする際に使われます。 しかし、複数のモジュールをインポートする場合、どういう順番でインポートすればコードが見やすくなるのかは悩ましい問題です。 この記事では、PrettierのimportOrderを使って、import文を自動的に整理する方法を紹介します。 prettier-plugin-sort-importsのインストール PrettierのimportOrder設定は、インポート文を特定の順序に並べ替えるためのものです。 importOrderを使うには、prettier-plugin-sort-importsというプラグインをインストールする必要があります。 npmでインストール
PrettierでHTMLの空要素に"/"が入る(VS Code使用)
<meta charset="UTF-8" /> <img src="xxx.jpg" alt="xxx" /> なぜHTMLの空要素の最後に"/"が入るのか？ Prettierのissue "Add an option to prefer void tags over self closing tags. #5246"、 ざっと読んだところこの仕様の理由は XML(XHTML)との互換性 読みやすさ などであり、設定で変更することはできない。 また別のissue"The formatting of self-closing tags in HTML5 #5641"によると、HTMLのフォーマッティングの開発時にそう決まったからだそう。 そして、オプションの理念ページには Prettier has a few options because of history. But we won’t
Prettier のサイズを減らすテクニック
実は先日リリースした Prettier 2.6 では前のバージョンである 2.5.1 と比べてバンドルサイズが 3MB ほど減っています。 Prettier 2.5.1 のサイズ(20.0MB) Prettier 2.6.0 のサイズ(16.9MB) リリースブログで言及したとおり Prettier 2.6 ではモジュールバンドラーを Rollup から esbuild に移行したので、その影響かと思われるかもしれませんが実はそれだけではありません。esbuild への移行によって減ったバンドルサイズはそれほど大きくはありませんでした。 バンドルサイズが 3 MB 減ったのは泥臭いチューニングをいくつか行った結果なのです。 この記事では Prettier 2.6 で実施したバンドルサイズを減らすテクニックを紹介します。 きっかけ ライブラリのサイズは大きいより小さい方が当然良いですが、その
Prettierに従わなくてもいい場合
https://nodejs.connpass.com/event/215218/ の発表資料です。すべて個人の意見です。
Next.js +TypeScriptで環境構築！ESLint + Prettierの導入から解析自動化までやってみた
はじめに こんばんは、バックエンドエンジニア見習い1年目のkuraoです！ 「Next.js+TypeScript」でアプリケーション環境を構築する機会があり、その際リンターツール導入の手順などと併せてドキュメントとしてまとめていたので、アウトプットを兼ねてこの場に書き連ねて行こうと思います！ 実現したい事 今回のアプリケーション環境構築で目指す所としては以下です。 Next.js環境のアプリを構築 Next.js環境のアプリにTypeScriptを導入 ESLint + Prettier を導入して、コードの一貫性を高め、かつバグ回避を行う husky + lint-staged を導入して、ESlintとPrettierによるコード解析を自動化する 前提 nodeがインストールしてある事（ver. 14.15.4） yarnパッケージがインストールしてある事（ver. 1.22.4）
ESLint, Prettier, VS Code, npm scripts の設定: 2021春
eslint-plugin-prettier 時代の設定をずっと使っていたので、重い腰を上げてアップデートした作業メモ。 背景 Prettier 公式ドキュメントによれば、現在 eslint-plugin-prettier は以下の問題があるとして推奨していない。 エディタが真っ赤になる（人間が気にする必要のない問題なのに！） 直接実行するより遅い（同様に prettier-eslint も遅い） ESLint と Prettier の間に間接レイヤーを追加するので、壊れやすい なるほど正しい。 一方、別々に実行することで以下のような問題も出てくるので、解決していく。 CLI とエディタを個別に設定する必要がある エディタで ESLint と Prettier の協調動作が必要 CLI (npm scripts) で ESLint と Prettier の対象ファイルが別管理になる 上記の
VSCodeでESLint/Prettierを有効化する (eslint-config-prettierで連携(Prettier公式の推奨設定(2020.6.28時点))) - 愛と幻想のアジャイル
先日、Next.js の チュートリアルを行うために、環境構築を行った。 takeken1.hatenablog.com 次に、ESLintとPrettierを導入する。 公式ページ eslint.org marketplace.visualstudio.com prettier.io marketplace.visualstudio.com やること ESLintもPrettierもプロジェクトローカルにインストールする 理由 プロジェクトごとに設定を固定させるため 個人開発の場合はPrettierはVSCodeバンドルを使うことで十分と思うが、チーム開発の場合コードスタイルの一貫性を保つ必要がある。今回はチーム開発で使える環境を構築したいため PrettierとESLintを共存させるにあたって、2020/6/28にPrettier公式からアナウンスされた推奨設定（eslint-con
Prettier と ESLint の組み合わせの公式推奨が変わり plugin が不要になった
前に書いた ESLint と Prettier の共存設定とその根拠について が公式推奨が変わったことにより一部間違った情報になっているのでその訂正記事です。 該当記事に書いた内容は Prettier と ESLint の関係を読み解く上で役立つ情報だと思うので、警告とこのページへのリンクを書いた上でそのまま残しておきます。 (追記) この記事の内容も間違った内容を書いていました。なので一度大幅な訂正をしています。prettier-eslint も推奨ではありません。 変更点の要約 Prettier と ESLint の組み合わせについて公式 の推奨方法が変わりました。 きっといつかこの情報も古くなるので直リンクではなく、ドキュメントの GitHub のリンクを貼っておきます。 ドキュメント自体のリンクはこちらです。 新しいドキュメントを要約すると、 Linter と Formatter
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 が何をどう解決したかを理解できないはずなので
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
