[Flutter] 플러터 개발을 위한 VS code 필수 확장 프로그램 및 설정 정리

Flutter 앱 개발을 시작하기 전, 개발 효율을 높이기 위해 미리 세팅해두면 좋은 VS Code 확장 프로그램(extension)들과 유용한 설정들을 정리해봤습니다.

Aug 08, 2025

Contents

Flutter 앱 개발을 시작하기 전, 개발 효율을 높이기 위해 미리 세팅해두면 좋은 VS Code 확장 프로그램(extension)들과 유용한 설정들을 정리해봤습니다.

확장명	설명
Dart	Dart 언어 지원. Flutter 개발의 핵심 언어
Flutter	Flutter SDK 연동 및 UI 미리보기, 디버깅 기능 지원
Awesome Flutter Snippets	자주 쓰는 Flutter 코드 스니펫 제공 (`stful`, `init`, `builder` 등)
Dart Import	자동 import 정리 및 최적화 (`ctrl+shift+p → organize imports`)
Pubspec Assist	pubspec.yaml 편하게 관리: 의존성 자동 추가 가능
Dart Data Class Generator	Dart 클래스를 자동으로 `copyWith`, `toJson`, `fromJson` 등 생성
Freezed	불변 데이터 클래스 생성 지원 (`freezed_annotation` 사용 시 유용)
Flutter Riverpod Snippets	Riverpod 상태 관리용 스니펫 제공 (`ref.watch`, `ConsumerWidget` 등)

확장명	설명
Remove Comments	주석을 한 번에 정리할 수 있는 확장
Error Lens	에러/워닝을 더 잘 보이도록 강조 표시
Image Preview	프로젝트 내 이미지 파일을 VS Code 안에서 바로 미리보기 가능


"editor.codeActionsOnSave": {
  "source.fixAll": true
}

저장 시 자동으로 모든 문제를 고칠 수 있는 코드 액션 실행
(불필요한 import 제거, 포매팅 등 포함)

Contents

Flutter 앱 개발을 시작하기 전, 개발 효율을 높이기 위해 미리 세팅해두면 좋은 VS Code 확장 프로그램(extension)들과 유용한 설정들을 정리해봤습니다.

Aug 08, 2025

Contents

Flutter 앱 개발을 시작하기 전, 개발 효율을 높이기 위해 미리 세팅해두면 좋은 VS Code 확장 프로그램(extension)들과 유용한 설정들을 정리해봤습니다.

확장명	설명
Dart	Dart 언어 지원. Flutter 개발의 핵심 언어
Flutter	Flutter SDK 연동 및 UI 미리보기, 디버깅 기능 지원
Awesome Flutter Snippets	자주 쓰는 Flutter 코드 스니펫 제공 (`stful`, `init`, `builder` 등)
Dart Import	자동 import 정리 및 최적화 (`ctrl+shift+p → organize imports`)
Pubspec Assist	pubspec.yaml 편하게 관리: 의존성 자동 추가 가능
Dart Data Class Generator	Dart 클래스를 자동으로 `copyWith`, `toJson`, `fromJson` 등 생성
Freezed	불변 데이터 클래스 생성 지원 (`freezed_annotation` 사용 시 유용)
Flutter Riverpod Snippets	Riverpod 상태 관리용 스니펫 제공 (`ref.watch`, `ConsumerWidget` 등)

확장명	설명
Remove Comments	주석을 한 번에 정리할 수 있는 확장
Error Lens	에러/워닝을 더 잘 보이도록 강조 표시
Image Preview	프로젝트 내 이미지 파일을 VS Code 안에서 바로 미리보기 가능


"editor.codeActionsOnSave": {
  "source.fixAll": true
}

저장 시 자동으로 모든 문제를 고칠 수 있는 코드 액션 실행
(불필요한 import 제거, 포매팅 등 포함)

Contents