これはなに コードベースに対し JSDoc の記述を必須化するための ESLint 設定手順をまとめたものです。 JSDoc を始めとする Doc コメントはコードに最も近いドキュメントであり、これがあるのと無いのとではコードベースの保守性に天と地ほどの差が生まれます。そんな JSDoc ですが、OSS ならともかく（内製・受託を問わず）商業ソフトウェア開発の現場では軽視されがちです。後からコーディング規約を定めたところで開発メンバーにドキュメントを書く習慣が備わっていなければ書き漏れが頻発するのが関の山です。 コードレビューで都度指摘するにはあまりにコストがかかるため、ESLint に委ねるのが望ましいです。 前提 フレームワークは React（or Next.js）を使っている。 TypeScript を主体としている。 ビルドスクリプトや設定ファイルは JavaScript も併用し
10月28日に開催された「VueFes Japan 2023」のイベントレポートをダイジェストでお届けします。 なお、公式サイトのタイムテーブル内に、一部の講演の資料がアップロードされています。 オープニング 実行委員長・ユーザーグループ代表の川口和也氏から、挨拶がありました。 今回は4トラックでスピーカーは35名、コアチームの来日など充実した内容になっています。またオフラインでの開催は5年ぶりです（台風やコロナの影響で、2018年以来です）。 川口氏は、フェイス・トゥ・フェイスで開催できる嬉しさやスポンサーへの感謝を述べました。 Evan You氏によるキーノート 基調講演はVue.jsの作者であるEvan You氏。広い会場で立ち見もでるほどの盛況でした。Evan You氏は、台風やコロナで日本に来れなかったため、久々の来日とのことです。 Evan You氏はVue.jsとVite
GitHub - azat-io/eslint-plugin-perfectionist: 🦄 ESLint plugin for sorting various data such as objects, imports, types, enums, JSX props, etc.
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
TypeScript 4.9からはsatisfies演算子でパターンの網羅性をESLintと共存しつつ簡単にチェックできる
TypeScript 4.9からはsatisfies演算子でパターンの網羅性をESLintと共存しつつ簡単にチェックできる export const stages = ["deve", "stag", "prod"] as const; /** * 開発用、本番用などを分けるステージ * {@link https://docs.aws.amazon.com/cdk/api/latest/docs/@aws-cdk_core.Stage.html} は一切関係がない */ export type Stage = typeof stages[number]; こうするとstagesを反復することで簡単に全てのステージに対してスタックを作ることが可能ですし、その名前にStageをstringとして埋め込んで区別することが可能です。 引数ではstringではなくStageを受け取ってstage =
このドキュメントは、次の Biome のブログの日本語訳になります。 細かい内容については、ぜひ原文の方を読んでもらえると嬉しいです。 ロードマップ 2024 コアコントリビューターとメンテナーが 2024 年にフォーカスしようとしていることを共有できることはとても嬉しいです。一方で、Biome はコミュニティ主導のプロジェクトであるため、取り上げている全てのアイデアのリリースを約束することはできません。 もしいくつかのアイデアに共感し、それらの開発を加速させたいと思った際には、次のような方法でサポートすることができます。 プロジェクトとコミュニティに参加する。アイデアを実装するためのサポートをすることができます。 スポンサーになる。Biome をお使いの会社では、スポンサーになることができます。Biome は CI の時間を削減し、費用を節約できるほど速いです。パフォーマンスは、プロジェ
Highlights This is a summary of the significant changes, both breaking and non-breaking, you need to know about when upgrading from ESLint v8.x to ESLint v9.0.0. Installing Because this is a major release, you may not automatically be upgraded by npm. To ensure you are using this version, run: npm i eslint@9.0.0 --save-dev Migration Guide As there are a lot of changes, we’ve created a migration gu
学校の課題や仕事をどうしてもやりたくないけど、数時間だけ余裕があって、プログラムは書きたい！というとき、みなさんはどうしていますか？ 最近の自分は ESLint をやっています。ということで自分が実装した変更を紹介していきます。 基本的に、ESLint の Rules ドキュメントを眺めてみて「バグがありそうだな〜」とか、「このルール足りてなさそう！」とか思ったときに Issue を作成して修正する方針でやりました。 ESLint の Contributor Pool プログラム ESLint には Contributor Pool プログラムというものがあります。OSS プロジェクトとしてとても良い取り組みだと思うのでここで紹介します。 Contributor Pool プログラム は、ESLint チームが外部の貢献者に対してその貢献に応じて報奨金を支払うという取り組みです。 私は E
ESLint v6.7.0 - Qiita
前 v6.6.0 | 次 v6.8.0 ESLint v6.7.0 has been released:https://t.co/GB8fHji3dq — ESLint (@geteslint) November 22, 2019 ESLint 6.7.0 がリリースされました。 小さな機能追加とバグ修正が行われています。 質問やバグ報告等ありましたら、お気軽にこちらまでお寄せください。 🏢 日本語 Issue 管理リポジトリ 👫 日本語サポート チャット 🏢 本家リポジトリ 👫 本家サポート チャット 🚀 本体への機能追加 設定ファイルのignorePatternsプロパティ 🔖 RFC022, #12274 共有設定を含む設定ファイルで、ignorePatternsプロパティが利用できるようになりました。このプロパティは.eslintignoreと同様に ESLint が無
コンポーネントをアクセシブルに保つ技術
アクセシビリティ Advent Calendar 2023 21日目の記事です。 Ubie株式会社 デザインエンジニアのtakanoripです。 Ubieではデザインシステムの1要素としてコンポーネントライブラリの実装を進めています。その中でコンポーネントをアクセシブルに保つための仕組みをいくつか導入しているので紹介します。 Linter まず一番オーソドックスなものとして、アクセシビリティ向けLintツールを導入しています。 Ubieではeslint-plugin-jsx-a11yとMarkuplintを導入しています。 両者は重複する部分もありますが、eslint-plugin-jsx-a11yはよりReactでの実装を考慮したチェック、Markuplintは純粋なマークアップのチェックに強みがあるので、両方のツールを使用することでより網羅的にチェックができます。 上記Lintはコンポ
GitHub - francoismassart/eslint-plugin-tailwindcss: ESLint plugin for Tailwind CSS usage
Learn more about each supported rules by reading their documentation: classnames-order: order classnames for consistency and it makes merge conflict a bit easier to resolve enforces-negative-arbitrary-values: make sure to use negative arbitrary values classname without the negative classname e.g. -top-[5px] should become top-[-5px] enforces-shorthand: merge multiple classnames into shorthand if po
どーも、入田 / ぐるたか @guru_taka です！ 本記事では Next.js (TypeScript) を環境構築し、ESLint（読み方：イーエスリント）と Prettier（読み方：プリティア）を導入する方法を紹介します。Next.js のバージョン 11 に対応しており、デフォルトで搭載されている ESLint の設定ファイルをベースとしています。 ESLint と Prettier を駆使することで、コードが綺麗になるため、導入することを強くオススメしたいです。本記事では、VS Code 上で、ESLint で構文解析しながら、ファイル保存時に ESLint + Prettier によるコード整形する方法をハンズオン形式でまとめています。
どういうこと？ 少し前に、CSS プロパティを自動ソートすると gzip 時のビルドサイズを減らせる記事を見ました 👇 これにならい、JSX の Props もソートしたら同じようになるんじゃね？って思って試したら、ビルドサイズを減らすことができたので、この場を借りてその知見を共有したいと思います 💪 検証環境 パッケージ名 バージョン
Introducing the ESLint Configuration Migrator - ESLint - Pluggable JavaScript Linter
We’ve heard you: One of the biggest reasons ESLint users haven’t upgraded to ESLint v9.x is migrating a configuration file seems difficult and complicated. Some plugins support flat config and the ESLint v9.x rule APIs and some don’t. Sometimes you need to use FlatCompat and sometimes you need to use the compatibility utilities. While we cover as much as we can in the migration guide, it can take
Published 08 May, 2020 under Release Notes ESLint v7.0.0 released We just pushed ESLint v7.0.0, which is a major release upgrade of ESLint. This release adds some new features and fixes several bugs found in the previous release. This release also has some breaking changes, so please read the following closely. Highlights There are several breaking changes in 7.0.0. We’ve created a migration guide
大量のエラーに対して rule ごとに高速に eslint --fix できるツール 「eslint-interactive」 を作ったので、その紹介です。 動機 ESLint のデフォルトの出力はエラーの発生源や修正のためのヒントなど、開発者に役立つ多くの情報を含みます。これは多く場合機能しますが、膨大な量のエラーが報告される状況ではあまり機能しません (例えばプロジェクトに ESLint を導入する時や、プロジェクトの .eslintrc に大幅な変更を加える時など)。そうした状況では ESLint の出力が膨大になってしまい、開発者による出力の分析が困難になってしまいます。また、多くの種類のエラーがごちゃまぜになって出力されているため、エラーを修正するのも困難です。 そのため、このような多くのエラー発生する状況では、以下の 2 つの事柄が重要であると考えています。 全てのエラーをまと
Release v3.0.0 · typescript-eslint/typescript-eslint
This major release has been a long time coming! We've been saving up breaking changes for a while now, waiting for the ESLint v7 release which we knew would deprecate support for node version 8. Due to our weekly release cadence, this major release mostly contains breaking changes! Breaking Changes Dropped support for Node version 8 (#1420) In line with ESLint v7 - we've also dropped explicit supp
What's coming in ESLint v7.0.0 - ESLint - Pluggable JavaScript Linter
Published 20 Feb, 2020 under API Changes What's coming in ESLint v7.0.0 We want to share with you the significant changes that will be coming in v7.0.0 so you can better prepare for the changes and understand why the changes are necessary. Last week, the Technical Steering Committee (TSC) met to finalize the features for ESLint v7.0.0. This feature set had not yet been locked down even as v7.0.0 w
Over the past few years, Etsy’s Web Platform team has spent a lot of time bringing our frontend code up to date. It was only a year and a half ago that we modernized our Javascript build system in order to enable advanced features, things like arrow functions and classes, that have been added to the language since 2015. And while this upgrade meant that we had futureproofed our codebase and could
Flat config rollout plans - ESLint - Pluggable JavaScript Linter
It may seem hard to believe, but the RFC for ESLint’s new configuration system, nicknamed flat config, was first written in 2019. It took until 2022 (v8.21.0) for us to release an experimental, opt-in version of flat config. Since then, we’ve been making changes and improvements based on feedback from the community. The plan was always to allow the current configuration system, nicknamed eslintrc,
Release v2.0.0 · typescript-eslint/typescript-eslint
2.0.0 (2019-08-13) BREAKING CHANGES Node 6 is no longer supported. Node 6 is now end of life. With the release of ESLint v6, they have dropped support for Node 6. As such, we have also dropped Node 6 from our testing pipeline. Please consider upgrading to a supported version of Node. See this page for more information about node version lifecycle and dates. parser / typescript-estree: When project
eslint-plugin-reactへのコントリビュートに挑戦してみた ~1月の活動を振り返る~ - toshi-toma blog
eslint-plugin-reactへのコントリビュートに挑戦してみた 今年からある程度まとまった単位で活動をブログなどの記事としてアウトプットしておくことで、それを使った振り返りができるように意識しています。 2020年もはや1月が終わり、どんなことをしてたか振り返るとeslint-plugin-reactへのPR作成に時間を使っていたのでまとめを書きます。 eslint-plugin-react GitHub - yannickcr/eslint-plugin-react: React specific linting rules for ESLint eslint-plugin-reactはESLintのプラグインの1つで、React用のルールが用意されています 有名なESLintのconfigであるeslint-config-airbnbなど、様々な場所で利用されています 最近は
ESLint にも TypeScript にも「ルールを設定してみたけど、いざ運用するとなるとエラー出ちゃった。これ動作確認して欲しいのにデプロイが CI に弾かれちゃう。うーん、ごまかしちゃえ(てへぺろ)」って時などに使えるハッチが存在しています。ファイル単位・ブロック単位・行単位でそれぞれいろいろな方法があるのでそれらをまとめます。 TypeScript word 単位で無視する ご存知の通り as や any が使えます。 行単位で無視する @ts-ignore で抑制できます。 TS2.6 からの機能でSuppress errors in .ts files using ’// @ts-ignore’ commentsによると、 TypeScript 2.6 support suppressing errors in .js files using // @ts-ignore co
ESLintはJavaScriptのソースコードを静的解析するツールです。 Lintツールはソースコードの書き方を統一したり、静的解析の段階で問題になりそうなコードや、明らかなバグを見つけるのに役立ちます。 .eslintrc.json ESLintの実行には設定ファイルが必要です。 これは「--init」で作成できます。 $ npm install --save-dev eslint $ npx eslint --init ? How would you like to use ESLint? To check syntax and find problems ? What type of modules does your project use? CommonJS (require/exports) ? Which framework does your project use? N
what's happening in V8? This is the talk I gave at NodeConfEU 2019 in Kilkenny, Ireland. ... JavaScript: The fairly odd parts --- explained JavaScript is the new language of choice for many applications, and...
We're thrilled to announce that oxlint is now generally available! This milestone signifies our team's ability to promptly address and triage issues. Oxlint is a JavaScript linter designed to catch erroneous or useless code without requiring any configurations by default. How to Use At this stage, oxlint is not intended to fully replace ESLint; it serves as an enhancement when ESLint's slowness b
14 Linting Rules To Help You Write Asynchronous Code in JavaScript
Debugging asynchronous code in JavaScript can feel like navigating a minefield at times. You don't know when and where the console.logs will print out, and you have no idea how your code is executed. It's hard to correctly structure async code so it executes in the right order as you intend it to. Wouldn't it be nice if you had some guidance while writing asynchronous code, and to get a helpful me
JSer.info #675 - Vue 3.4 がリリースされました。 Announcing Vue 3.4 | The Vue Point Vue 3.4ではVueテンプレートのパーサーのパフォーマンス改善、watchEffectの改善、defineModelがStable APIに変更されています。 また、v-bindが同名の場合の省略記法を追加、Hydrationのエラー表示を改善などの変更も含まれています。 破壊的な変更として、global JSX namespaceの型を定義しないように変更、実験的な機能だったReactivity Transformの削除なども含まれています。 関連して、Vue 2.x は2023年12月31日にサポートが終了し、End of Life(EOL)となりました。 Vue 2 Has Reached End of Life 最終バージョンは2.7.
Introducing ESLint Config Inspector - ESLint - Pluggable JavaScript Linter
As of ESLint v9,0.0, the new configuration system has reached general availability, bringing with it many benefits. Configuration files are now easier to manage and more transparent to compose. However, it can still be non-trivial to understand which rules are enabled and disabled for specific files, especially when your configuration is complex or composed from multiple sources. That’s why we are
C++とJSを跨ぐ クロスコンポーネント ガベージコレクタ 服部慶士（keishi@chromium.org） 2021-08-31 https://bit.ly/3DzLRBs 1
（2022/2/17 更にドキュメントを詳しく参照するように加筆と、一部コマンドを修正しました✍） ESLintとPrettierの設定、皆さんどうされていますか？🤔 私は結構雰囲気でググった記事を参考にやっていました。 ですが、いろんなところで言及されているところですが、ESLintとPrettier周りは過去推奨だったものが現在非推奨になっていたりと、移り変わりがあります。 今では非推奨になっているプラグインを用いている過去記事などあり、それをあたっている方もいらっしゃるかもしれません。 各々その時々ドキュメントを参照するのがベストですが、今回は、2022年2月現在、最新のドキュメントを丹念に見ながらESLintとPrettierの設定をしてみます。 おまけとして、husky+lint-stagedとeslint-plugin-importの設定もしていきます。 ESLintの設定か
ESLint 設定を作成する技術
ESLint は関連するパッケージが多く、また、活発に開発されていることもあり、設定するのに一苦労ということも多いツールです。そういった方向けに ESLint の設定を作るための基礎的な説明を書いてみました。 設定ファイルの拡張子 設定用のファイルとしてプロジェクトのルートディレクトリーに .eslintrc.yml もしくは .eslintrc.json を作成しましょう。一般的な開発用途であれば YAML か JSON で事足りるからです。 YAML と JSON のどちらを選ぶかはお好みでどうぞ。ちなみに ESLint は .eslintrc.* もしくは package.json 内の eslintConfig 設定を読んでくれます。 また、 package.json 内に設定を書くのは避けましょう。様々な理由で package.json は変更されるため、 Git 管理下において
スプシの翻訳情報を用いた型付けと段階的i18n対応のためのカスタムESLint ### 内容 ・@nuxt/i18nのt関数にパッチを当ててスプシから生成された翻訳情報で型を付ける ・段階的なi18n対応のために特定ファイルから参照されるコードのみに翻訳漏れを検証するカスタムESLint
こんにちはhiro08です。 各プロジェクトで ESLint の設定が混在していたため、パッケージ化して npm に公開しました。下記が GitHub のリポジトリと npm で公開したパッケージです。 GitHub リポジトリ npm パッケージ 今回の設定は、個人プロジェクトで使ってます。各プロジェクトで ESLint の設定を共通化できたことで個人的に運用がしやすくなりました。なので、今回は ESLint の設定をパッケージ化して npm で公開する方法をまとめてみました。 前提 あらかじめ npm のアカウントを作成してください。 ローカルで npm にログインする必要があります。
GitHub - quick-lint/quick-lint-js: quick-lint-js finds bugs in JavaScript programs
You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
eslint-plugin-prettier を ESLint から 分離するサンプル – Intellij IDEA の設定変更も | DevelopersIO
すでにこちらの方の解説ブログもありますが、ESLint と Prettier を組み合わせる場合の推奨方法が変わりました。 Prettier と ESLint の組み合わせの公式推奨が変わり plugin が不要になった 本稿では リポジトリに適用してみて Before/After を具体的に見ていきます。 TL;DR エディタが ESLint にも Prettier にも対応しているならば ESLint から eslint-plugin-prettier を除外し、ESLint と Prettier が個別に実行されるようにする。 コンテンツ 推奨がどう変わったか どこをどう変更すればよいか Intellij IDEA / WebStorm の場合、どの設定を変更すればよいか 推奨がどう変わったか Prettier はもともと ESLint のプラグインとしても使うことができました。多く
なぜ脱 TSLint するのか いままで TypeScript の Linter として TSLint を使っていました。 ですが、TSLint は開発コミュニティが活発とはいえないことが以前から指摘されていました。 TSLint is dead - Klaus Meinhardt - Medium そんな中で、TSLint 開発チームは ESLint のプラグインとして TSLint の機能を統合していく typescript-eslint プロジェクトを開始し、TSLint は 2019年中に非推奨となる予定である ことが発表されました。 Roadmap: TSLint -> ESLint · Issue #4534 · palantir/tslint typescript-eslint/typescript-eslint: Monorepo for all the tooling w
[[toc]] 中文 Chinese Version I have started writing this post multiple times but never ended up posting it. I wasn't able to figure out a proper way to express my position about Prettier. But this time, I think I should try harder to explain that for future reference. First of all, I am not against Prettier. Actually, I love it. I Love Prettier Prettier is a great tool, and it saved me a lot of time
はじめに VSCodeのsettings.jsonを見直している中でフォーマッタの設定についてEslint、Prettierのドキュメントを見ていたらPrettierの公式ドキュメントで↓のページを見つけた。 Integrating with Linters#Notes When searching for both Prettier and your linter on the Internet you’ll probably find more related projects. These are generally not recommended, but can be useful in certain circumstances. First, we have plugins that let you run Prettier as if it was a linter rul
Introducing ESLint Compatibility Utilities - ESLint - Pluggable JavaScript Linter
The release of ESLint v9.0.0 brought with it the rollout of the new configuration system, but also a series of changes to the rules API. These changes are necessary in order to prepare ESLint for implementing language plugins, which will give ESLint the ability to natively lint languages other than JavaScript. As a result, plugin authors needed to update their rules to work with v9.0.0, and unfort
Commitzenで開発環境を整備
概要 本記事では、Commitzen を利用し、コミット環境を整備していきます。具体的には、以下についてカバーします。 commitzen で対話的にコミットメッセージを入力可能にする cz-customizable で commitzen のプロンプトをカスタマイズする commitlint でコミットメッセージが規約に沿っているかチェックする husky でコミット前にコミットメッセージが規約に沿っているかチェックする lint-stage でステージングエリアに追加されたファイルに対して ESLint の Linting と Prettier のフォーマットを実行 本記事の構成 Next.js で作業環境を構築 ESLint を設定 Prettier を設定 husky を設定 lint-staged を設定 commitlint を設定 commitzen を設定 cz-custo
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
ESLint を使って JSDoc / TSDoc の記述を必須化する
VueFes Japan 2023イベントレポート | gihyo.jp
Biome の 2024年のロードマップの公開と v1.5.0 のリリース
ESLint v9.0.0 released - ESLint - Pluggable JavaScript Linter
最近は ESLint をいじって遊んでるので紹介します
Next.js (TypeScript) に ESLint と Prettier を導入し、コードを綺麗に保とう | fwywd（フュード）powered by キカガク
Next.js で Props をソートすると gzip 時のビルドサイズを少しだけ減らせる
ESLint v7.0.0 released - ESLint - Pluggable JavaScript Linter
rule ごとに高速に eslint --fix できるツールを作った - mizdra's blog
Etsy Engineering | Etsy’s Journey to TypeScript
TypeScript と ESLint における検査エラーを無視したい時のおまじないまとめ
ESLintと「eslint --init」による「.eslintrc.json」の生成
Chrome DevTools by Benedikt Meurer
The JavaScript Oxidation Compiler
2024-01-02のJS: Vue 3.4、Vue 2.xのEOL、quick-lint-js 3.0.0、AstroとDenoの2023年まとめ
PPL C++とJSを跨ぐ クロスコンポーネント ガベージコレクタ
ESLintとPrettierの設定をドキュメントを丹念に見ながらやる（2022年2月時点）
TypeScriptを活用したi18n対応
ESLintの設定をパッケージ化してnpmで公開する
脱TSLintして、ESLint TypeScript Plugin に移行する - Qiita
Why I don't use Prettier
いつのまにかeslint-plugin-prettierが推奨されないものになってた