はじめに
社内でOSS活動を広める一環として、RenovateとESLintのShareableConfigをOSSとして公開しました。
OSS活動をもっと身近に感じていただくためのきっかけになればと考えています。
過去にこちらの記事で紹介した「LooksToMe」というサービスも、このOSS活動の一環として展開しています。
今回は新たに公開した、RenovateとESLintのShareableConfigについて紹介させて頂きます。
Renovate
Renovateは、プロジェクトの依存関係を自動でアップデートしてくれるツールです。
Configを設定することで、アップデートのタイミングや、自動マージの設定などを行う事ができます。
しかし、設定できる項目が非常に多く、プロジェクト毎に設定を行うのは大変です。
ドキュメントのサイドバーにあるTOCの項目数をカウントしてみると、なんと156項目もあります。
そこで、Renovateの設定をShareableConfigとして公開しました。
ShareableConfigを使うことで、プロジェクト毎に個別の設定を行う必要がなくなり、設定のミスも防ぐことができます。
まだ、弊社ではRenovateを導入して日が浅いので、ShareableConfigの内容は少ないですが、今後もプロジェクトで得た知見を元に順次設定を追加していく予定です。
使い方
ShareableConfigを使うのは非常に簡単です。
RenovateのConfigに、ShareableConfigを公開しているGitHubのURLを指定するだけです。
{
"$schema": "https://docs.renovatebot.com/renovate-schema.json",
"extends": [
"github>agaroot-technologies/renovate-config"
]
}
ESLint
ESLintは、JavaScriptの静的解析ツールです。
WebエンジニアでESLintを使ったことが無い人はいないのではないでしょうか。
また、ESLintを導入した事がある人で、Configの複雑さに悩まされた事がある人は多いのではないでしょうか。
ESLintには様々なPluginがあり、プロジェクト毎に適切なPluginを選択し導入する必要があります。
TypeScriptであれば、@typescript-eslint/eslint-pluginを、Reactであればeslint-plugin-reactを、といった具合です。
その他にも、importを整理に便利なeslint-plugin-importなどもあります。
ESLintにもRenovateと同じく、ShareableConfigという機能があります。
そこで、Renovateと同じく、ESLintのShareableConfigも公開しました。
FlatConfigを採用するか悩んだのですが、まだExperimentalな機能かつ、FlatConfigに対応していないPluginもあるため、今回は従来のConfig形式を採用しました。
@typescript-eslintも、FlatConfigが正式にリリースされるまで、従来のConfig形式のみをサポートするとのことです。
使い方
Renovateと同じく、ShareableConfigを使うのは非常に簡単です。
まず、Configの設定に必要な依存関係をインストールします。
npm install -D @agaroot/eslint-config-common @typescript-eslint/eslint-plugin @typescript-eslint/parser eslint eslint-import-resolver-typescript eslint-plugin-import eslint-plugin-unused-imports
あとは、ESLintのConfigにShareableConfig名を指定し、TypeScript関連の設定を追加するだけです。
/** @type {import('eslint').Linter.Config} */
module.exports = {
root: true,
extends: [
'@agaroot/eslint-config-common',
],
parserOptions: {
project: './tsconfig.json',
},
settings: {
'import/resolver': {
typescript: {
project: './tsconfig.json',
},
},
},
};
プロジェクト毎に適切なConfigが設定できるように、ShareableConfigは複数用意しています。
@agaroot/eslint-config-commonの他に、@agaroot/eslint-config-reactや@agaroot/eslint-config-jestなどがあります。
詳しくは、GitHubのリポジトリをご覧ください。
Discussion