Flutter VS code 개발환경 구축

 Flutter - VS code 개발환경 구축

Android Studio를 설치하였다면 그대로 개발을 진행해도 좋지만 필자는 VS code로 개발하는게 편해서 
사용하는 김에 개발환경 구축하는 방법에 대해서 포스팅 해보려고 합니다.🤗

💡 이때 Visual Studio Code는 설치했다는 가정하에 작성하였습니다.

---

1. flutter 확장 프로그램 설치

아래의 사진과 같이 확장 아이콘을 클릭해서 flutter를 검색후 설치를 해줍니다.

💬 만약 'Flutter' 확장을 설치하는 동안 오류가 발생했습니다. 로그를 확인하세요 라는 오류 문구가 뜬다면?
👉 vs code를 종료했다가 실행시키면 대부분 해결될 것입니다.

 

2. flutter doctor -v 명령어 수행

flutter doctor -v 명령어
flutter의 설치 상태를 알려주는 명령어이다.

터미널을 실행해서 flutter doctor -v 명령어를 입력합니다.
아래는 명령어를 실행했고 모두 정상설치가 되었을 때 보이는 문구입니다.

[√] Flutter (Channel stable, 3.10.0, on Microsoft Windows [Version 10.0.19045.3324], locale ko-KR)
    • Flutter version 3.10.0 on channel stable at C:\src\flutter_windows_3.0.1-stable\flutter
    • Upstream repository https://github.com/flutter/flutter.git
    • Framework revision 84a1e904f4 (4 months ago), 2023-05-09 07:41:44 -0700
    • Engine revision d44b5a94c9
    • Dart version 3.0.0
    • DevTools version 2.23.1

[√] Windows Version (Installed version of Windows is version 10 or higher)

[√] Android toolchain - develop for Android devices (Android SDK version 32.1.0-rc1)
    • Android SDK at C:\Users\esjeoung\AppData\Local\Android\Sdk
    • Platform android-33, build-tools 32.1.0-rc1
    • ANDROID_HOME = C:\Users\esjeoung\AppData\Local\Android\Sdk
    • Java binary at: C:\Program Files\Android\Android Studio\jre\bin\java
    • Java version OpenJDK Runtime Environment (build 11.0.12+7-b1504.28-7817840)
    • All Android licenses accepted.

[√] Chrome - develop for the web
    • Chrome at C:\Program Files\Google\Chrome\Application\chrome.exe

[√] Visual Studio - develop for Windows (Visual Studio Community 2019 16.11.8)
    • Visual Studio at C:\Program Files (x86)\Microsoft Visual Studio\2019\Community
    • Visual Studio Community 2019 version 16.11.32002.261
    • Windows 10 SDK version 10.0.22000.0

[√] Android Studio (version 2021.2)
    • Android Studio at C:\Program Files\Android\Android Studio
    • Flutter plugin can be installed from:
       https://plugins.jetbrains.com/plugin/9212-flutter
    • Dart plugin can be installed from:
       https://plugins.jetbrains.com/plugin/6351-dart
    • Java version OpenJDK Runtime Environment (build 11.0.12+7-b1504.28-7817840)

[√] VS Code (version 1.81.1)
    • VS Code at C:\Users\esjeoung\AppData\Local\Programs\Microsoft VS Code
    • Flutter extension version 3.52.0

[√] Connected device (3 available)
    • Windows (desktop) • windows • windows-x64    • Microsoft Windows [Version 10.0.19045.3324]
    • Chrome (web)      • chrome  • web-javascript • Google Chrome 116.0.5845.97
    • Edge (web)        • edge    • web-javascript • Microsoft Edge 115.0.1901.203

[√] Network resources
    • All expected network resources are available.

• No issues found!

이때 [✔] 표시면 정상설치가 되었다는 뜻이고 [!] 표시가 뜨면 추가적인 조치가 필요하다는 의미입니다.
대부분 [!] Android toolchan - develop for Android devices 부분이 조치가 필요하다고 나올 것입니다.

 

[!] Android toolchan - develop for Android devices  해결방법

터미널 창에 들어가서 flutter doctor --android-licenses 명령어를 수행합니다.
명령어를 수행하고 엔터를 치면 동의 문구가 나오는데 전부 y를 입력해줍니다.

 

그럼에도 불구하고 flutter doctor --android-licenses 했는대도 오류가 발생한거면 
AndroidStudio에서 Android SDK Command-line Tools를 다운받아야 합니다
다운 받는 방법은 아래의 사진과 같습니다

👍 다음에는 vs code로 프로젝트를 생성하고 디버깅하면서 개발을 진행하면 되겠습니다!

 

이제 Flutter를 개발하기 위한 준비가 모두 완료되었습니다.
이제는 모두 즐거운? Flutter 개발을 시작해보자구요!!
코딩이 쉬워지는 그날까지!!