ESlintの入れ方

npm install eslint --save-dev

npx eslint --init

指示に従って、用途を選択。
.eslintrc.json
が生成される。（選択によっては、.js等でもいいらしい）

Reactを使っていて、importを並べ替え・不要なものの削除をしたいので、

npm install --save-dev eslint-plugin-import eslint-plugin-unused-imports

.eslintrc.json
でルールを設定できるので、例えば、下記のように設定。

{
	"env": {
	"browser": true,
	"es2021": true
},
"extends": [
	"eslint:recommended",
	"plugin:react/recommended",
	"plugin:@typescript-eslint/recommended"
],
	"overrides": [],
	"parser": "@typescript-eslint/parser",
	"parserOptions": {
	"ecmaVersion": 2021,
	"sourceType": "module"
},
"plugins": ["react", "@typescript-eslint", "import", "unused-imports"],
"rules": {
	"import/order": [
		"error",
		{
			"groups": [
			"builtin", 
			"external", 
			"internal", 
			["parent", "sibling"],
			"object",
			"type",
			"index"
			],
			"newlines-between": "always",
			"pathGroupsExcludedImportTypes": ["builtin"],
			"alphabetize": {
				"order": "asc", 
				"caseInsensitive": true 
			},
			"pathGroups": [
				{
					"pattern": "@/components/common",
					"group": "internal",
					"position": "before"
				},
				{
					"pattern": "@/components/hooks",
					"group": "internal",
					"position": "before"
				}
			]
		}
	],
	"unused-imports/no-unused-imports": "warn",
	//このへんはエラーにしなくていいと個人的に思ったのでOFF。
	"react/jsx-uses-react": "off",
	"react/react-in-jsx-scope": "off",
	"react/no-children-prop": "off",
	//eslint-plugin-unused-importsを使うときに、OFFにしないとエラーがでるらしい。
	"@typescript-eslint/no-unused-vars": "off"
},
"settings": {
"react": {
	"version": "detect"
	}
}
}

https://qiita.com/yukiji/items/5ba9e065ac6ed57d05a4
こちらの方の設定を参考にしつつ、自分で必要な設定を加えています。
VScodeを使っているので、保存時にESlintを実行したい。
VScodeを開いて、
Ctrl＋Shift＋P　→Preferences:Open User Settingを開くと、setting.jsonが開く。

"editor.formatOnSave": true,
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  },

このあたりが設定されていればいいっぽい。