[Flutter] Mac/VS Code에서 Flutter 코드 자동정렬하기(별도 확장 필요 x)

VS Code에서 Flutter를 쓰는 경우 자동정렬로 애를 먹는 경우가 많다.
이는 VS Code에서 Dart 포맷팅을 하기 위해서는 별도로 설정해줘야 하는 설정이 존재하기 때문이다.

빠르게 자동정렬 하는 법을 소개하겠다!
1. settings.json 파일 수정
2. VS Code 설정 수정

1. settings.json

해당 파일은 vs code 설정 파일인데, 간단한 접근 방법은
vs code 창 맨 하단 줄에 여러 설정들 중 dart를 클릭하면

상단에 이런 화면이 뜨게 된다. 이때 언어 기반 설정 구성을 누르면,
자동으로 settings.json 파일이 뜨게 된다.

아니면 그냥 찾아서 들어가면 됨!

  "[dart]": {
    "editor.formatOnSave": true,
    "editor.tabSize": 2,
    "editor.insertSpaces": true,
    "editor.detectIndentation": false,
    "editor.suggest.insertMode": "replace",
    "editor.defaultFormatter": "Dart-Code.dart-code",
    "editor.inlayHints.enabled": "offUnlessPressed"
  }

들어가면 자동적으로 Dart 설정이 되어 있을 것이다.
여기서 중요한 건

"editor.formatOnSave": true,
"editor.defaultFormatter": "Dart-Code.dart-code",

위 두 부분이 무조건 설정되어 있어야 한다.
Dart는 별도로 기본 설정이 없어 해당 설정을 통해 반영하기 때문이다.

이후 저장하고 settings.json 파일을 나오면 된다.

2. VS Code 설정 변경

cmd + , 를 눌러 설정에 들어간다.

여기서 Sdk Formatter를 체크하고 (현재 Dart sdk에 존재하는 포맷터를 사용해줄 것이다.)
Default Formatter를 Dart로 설정한다.
-> 1에서 "editor.defaultFormatter": "Dart-Code.dart-code" 로 설정해줬기 때문에 동일하게 설정한다. 아마 되어있을 것이다.

📍마지막으로 vs code를 재시작하면 자동 포맷팅이 될 것이다! 안되면 또 설정문제..................... 스택오버플로우에서도 이 방법이 제일 많이 사용된다.

[참고]
https://stackoverflow.com/questions/62889725/disable-autoformat-in-vs-code-for-dart