vscodeで保存した時に自動でlintされるようにする

• 必要なpackageをインストールする

npm install --save-dev eslint prettier eslint-config-prettier

• eslintの設定ファイルを作成

npx eslint --init

• 各質問の解答は以下

✔ How would you like to use ESLint? · style
✔ What type of modules does your project use? · esm
✔ Which framework does your project use? · none
✔ Does your project use TypeScript? · No / Yes
✔ Where does your code run? · browser
✔ How would you like to define a style for your project? · guide
✔ Which style guide do you want to follow? · standard
✔ What format do you want your config file to be in? · JavaScript
Checking peerDependencies of eslint-config-standard@latest
✔ The style guide "standard" requires eslint@^7.12.1. You are currently using eslint@8.10.0.
  Do you want to downgrade? · No / Yes

• .eslintrc.jsに prettier の設定を追加

module.exports = {
  env: {
    browser: true,
    es2021: true
  },
  extends: [
    'standard',
    'prettier'
  ],
  parser: '@typescript-eslint/parser',
  parserOptions: {
    ecmaVersion: 'latest',
    sourceType: 'module'
  },
  plugins: [
    '@typescript-eslint'
  ],
  rules: {
  }
}

• .vscode/settings.jsonに設定を追加

{
  // フォーマッターをPrettierにする
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  // ファイル保存時にフォーマットを実行
  "editor.formatOnSave": true
}