よく使い回すのでメモ。 仕事上ほとんど CircleCI なので例は config.yml だけど、どこでも変わらない。 TL;DR Prettier 1.16 以降 prettier 1.16 から --check オプションが追加された。変なことをしなくても以下で OK。
TypeScriptのプロジェクトへのPrettierの導入紹介です。 (2019-02-11 ESLintのTypeScriptサポート強化が表明されていることをふまえて追記: この投稿はTSLintとPrettierを組み合わせる場合について記述しています。ESLint+Prettier for TypeScriptについてではないことにご注意ください。) Prettierとは Prettierはコードフォーマッタです。JavaScript(ES2017含む)、JSX、Vue、Flow、TypeScript、CSS(Less,SCSS)、JSON、GraphQL、Markdownとフロントエンド開発で使われる言語/仕様に多く対応しています。適用することでコードに一貫したスタイルをもたらします。 一貫したスタイルは読みやすさ、ひいては保守性につながる大正義です。 また、後述するように保存
Robert Cooper Posted on Feb 16, 2019 • Updated on Mar 11, 2019 • Originally published at robertcooper.me Originally posted on my blog. When it comes to linting TypeScript code, there are two major linting options to choose from: TSLint and ESLint. TSLint is a linter than can only be used for TypeScript, while ESLint supports both JavaScript and TypeScript. In the TypeScript 2019 Roadmap, the TypeS
今さらだけどメモ。 ESLint を使っているプロジェクトに Prettier を導入するときの設定方法。 結論としては、公式のこのページに全部まとまってた。 なお、 prettier-eslint というのもあるようだが調べていない。 先にまとめ eslint-plugin-prettier: ESLint と一緒に Prettier のチェックをしたい場合に導入する eslint-config-prettier: Prettier とバッティングする、ESLint のフォーマット関係のルールを無効化する 1, 2 両方やりたい場合、両方インストールして ESLint の設定に "extends": ["plugin:prettier/recommended"] と書けば OK eslint-plugin-prettier も eslint-config-prettier も公式のパッケ
$ yarn eslint --init ? How would you like to configure ESLint? Answer questions about your style ? Which version of ECMAScript do you use? ES2018 ? Are you using ES6 modules? Yes ? Where will your code run? Browser ? Do you use CommonJS? Yes ? Do you use JSX? Yes ? Do you use React? No ? What style of indentation do you use? Spaces ? What quotes do you use for strings? Single ? What line endings d
追記: 2019/05/01 最近の@typescript-eslint/eslint-plugin, Prettierのアップデートによって、正式にTypeScript 3.4対応されました。一通り普通に動いてる感じ。 これまで自分で使っていて問題になったのがパフォーマンス。ESLint単体やTSLintに比べて、プロジェクトによるだろうけど2倍以上遅い。体感で結構辛い。 Poor performance on some projects · Issue #389 · typescript-eslint/typescript-eslint これはTypeScriptのパーサーを通す部分の構造上の問題が原因なので、簡単には直せなそうな気配。 とりあえず、個人的には型を必要とするルールにそこまでの価値を感じていないので、該当ルールを無効にしてparserOptions > projectを削
お知らせ(2021/05/26 追記) 以前はeslint --fixなどで ESLint を実行時に Prettier でコードを整形し、整形したコードに対して構文チェックが実行されるようにすることが推奨されていました。 ESLint で Prettier を実行するためには、ESLint の Plugin が必要でしたが、これを利用することが公式で推奨されなくなりました(詳細はこちら)。 そのため、記事を更新して Prettier と ESLint をそれぞれ実行させるような内容に変更しました(ついでに husky のバージョンも上げており、それに関する内容も更新しています)。 更新前のコードや記事は以下にありますので、必要に応じてご確認ください。 はじめに Prettier(v.2.3.0) に関しての備忘録です。 「Prettier の何が便利なのかよくわからない」 「ESLint
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く