파일 저장시 자동으로 eslint error 고치는 방법

예를 들어, type import를 했을 때 `import type { Type } from`이 아니라 `import { Type } from`을 하면 오류가 나도록 eslint rule 설정했다고 하자. 

 // .eslintrc
 { 
   ...
   rules: {
    ...
    'react/self-closing-comp': ['error', { component: true, html: true }],
    '@typescript-eslint/consistent-type-imports': [
      'error',
      {
        prefer: 'type-imports',
      },
    ],
  },

오류가 났을 때 직접 type을 추가해 주는 것보다 파일 저장을 할 때마다 자동으로 type이 추가되면 작업 속도가 엄청 증가하게 된다. 만약 저장을 했을 때 자동으로 에러가 고쳐지지 않는다면 아래의 과정을 거치면 된다.

 

ctrl+shift+p를 눌러서

User Settings (JSON)을 클릭한다.

`setting.json` 파일이 열리면 아래 코드를 추가해 주면 된다.

 

// setting.json
{
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true
  },
}