VSCode로 flutter를 코딩하다보면 불편한 점이 존재한다. 그래서 VSCode로 코딩했을 때 불편한 점을 줄이고자 간단한 셋팅을 하고자 한다.
1. warning 줄 없애기
1) 설정 전
flutter 코딩을 하다보면 위의 사진과 같이 파란줄이 표시된다. 이는 warning인데, 거의 const를 붙이라는 warning이다.
2) 설정 하기
2-1) 명령 팔레트 들어가기
warning을 없앨려면 VSCode 왼쪽 하단에 톱니바퀴 즉 설정을 눌러 명령 팔레트를 누른다. 혹은 ctrl + shift +p 단축키를 눌러도 된다. 그리고 setting이라고 쳤을 때, 아래 사진과 같이 나오면 이를 클릭한다.
간혹 아래와 같이 두개가 나오는데, (JSON)이 아닌 (JSON)이 없는 것을 누르면 안된다.
2-2) 사용자 설정 열기(JSON)
setting.json파일이 열리면 된 것이다.
setting.json파일에서 아래 코드를 추가한다.
"editor.codeActionsOnSave": {
"source.fixAll": true
}
3) 설정 후
그러면 위와 같이 warning표시가 없어지고, 파란줄이 떴던 해당 항목에 const가 붙게 된다.
2. 트리 구조 가이드 만들기
1) 설정 전
VSCode에서 flutter 코딩을 하다보면 위와 같이 코드를 볼 때 가독성이 떨어지게 된다. 그래서 트리 구조 가이드를 설정해주도록 한다.
2) 설정 하기
위에서 설명한 것같이 settings.json파일에 들어가서 아래의 코드를 붙여준다.
"dart.previewFlutterUiGuides": true,
코드를 붙여주고 나면 바로 설정되는 것이 아니라, VSCode프로그램을 껐다가 다시 열면 설정이 되어 있다.
3) 설정 후
위와 같이 트리구조로 볼 수 있게 된다.
추가)
아래의 코드가 없다면 추가해놓도록 한다. true로 설정시 파일을 저장하게 되면 자동으로 포맷팅이 된다.
"editor.formatOnSave": true,
