본문 바로가기
프로그래밍 _공부자료.

vscode 에서 flutter 개발환경 셋팅하기

by 대구부자 2023. 10. 17.
반응형

VS Code를 사용하여 Flutter 개발 환경을 설정하는 방법은 다음과 같습니다:

1. **Flutter SDK 설치**: 먼저 Flutter SDK를 설치해야 합니다. Flutter 공식 웹사이트에서 제공하는 설치 가이드에 따라 진행하시면 됩니다.

2. **VS Code 설치**: Visual Studio Code(VS Code)는 Microsoft에서 제공하는 무료 코드 에디터로, 여러 언어와 플랫폼을 지원합니다. VS Code 공식 웹사이트에서 최신 버전의 VS Code를 다운로드하고 설치하세요.

3. **Flutter와 Dart 플러그인 설치**: VS Code를 실행한 후, 'Extensions' 메뉴(사이드바의 네모 아이콘)를 클릭합니다. 검색창에 "Flutter"라고 입력하고 나오는 결과 중 Flutter 플러그인을 선택하여 'Install' 버튼을 클릭합니다. 이 플러그인은 Dart도 함께 포함하고 있으므로 별도로 Dart 플러그인을 설치할 필요는 없습니다.

4. **환경 변수 설정 (Windows 사용자)**: 환경 변수에 Flutter SDK 경로를 추가해야 합니다.
    - 내 PC -> 속성 -> 고급 시스템 설정 -> 환경 변수
    - 시스템 변수 섹션에서 Path 항목 선택 후 '편집'
    - 새로 만들기 클릭 후 Flutter SDK의 bin 폴더 경로 입력

5. **새 프로젝트 생성**: VS Code 상태바(아래쪽 파란색 바)에 있는 'No Configurations' 부분을 클릭한 후 'Start Debugging' 를 선택하거나 단축키 F5를 누르면 새 프로젝트가 생성됩니다.

6. **에뮬레이터 설정 및 실행**: Android Studio가 이미 설치되어 있다면 AVD Manager에서 에뮬레이터를 생성할 수 있습니다.
   - 에뮬레이터 실행: 단축키 `Ctrl+Shift+P` 를 누른 후, Command Palette에 "Flutter: Launch Emulator" 입력

7. 앞서 진행한 모든 설정 이후, 단축키 `F5` 혹은 `Ctrl+F5` (디버깅 없는 시작)으로 앱을 실행할 수 있습니다.

위 절차들은 기본적인 것들이며, 개발 환경은 개인의 취향과 필요에 따라 다양하게 설정할 수 있습니다. 더 많은 정보는 Flutter와 VS Code의 공식 문서에서 찾을 수 있습니다.

반응형

댓글