[Flutter] Flutter 개발 환경 세팅

1. VSCODE 설치 (비주얼 스튜디오 설치)

https://code.visualstudio.com/

Visual Studio Code - Code Editing. Redefined

2. 설치된 VSCODE에 MaketPlace를 이용하여 추가로 필요한 확장 플러그인을 설치한다.

Flutter

- 기본

 Korean Language Pack for Visual Studio Code 

- VS CODE용 한국어 팩 (영어로 되어있는 개발 툴이 한글로 번역되어 보여진다)

RainBow Brackets

- 코드 가독성을 위해 사용한다.

Error Lens

- 에러를 가독성 있게 보여준다.

Material Icon Theme

- 파일 아이콘을 이쁘게 표현해준다.

Flutter Color

- 색상 코드 옆에 색을 미리 볼 수 있게 표현해준다.

2. Flutter SDK를 설치한다.

https://docs.flutter.dev/development/tools/sdk/releases

Flutter SDK releases

위 URL을 통해 SDK를 설치한 뒤,

[시스템 환경 변수 편집]-[고급]-[환경 변수]-사용자 변수-Path에 Flutter SDK가 설치된 경로를 추가 등록한다.

[ EX) C:\DEV\flutter\bin ]

이후 커맨드 창에서 flutter doctor 입력하면 라이선스 

위와 같이 추가 필요 설치해야할 툴들이 나열되어있다.

하지만 안드로이드 스튜디오는 설치하지 않는 쪽으로 개발환경 세팅을 할 것이다.

해당 이슈에서 Visual Studio 같은 경우에는 Intsallter에서 Desktop development with C++을 클릭하여 설치한다.

3. Android SDK 설치

Android SDK 설치하기 위해서는 JDK가 필요하다.

openJDK 를 설치해서 환경변수에 시스템 변수에 JAVA_HOME을 추가하여 준다.

https://github.com/ojdkbuild/ojdkbuild

GitHub - ojdkbuild/ojdkbuild: Community builds using source code from OpenJDK project

위 경로에서 최신 openJDK를 설치해도 좋다.

 

https://developer.android.com/studio

Download Android Studio and SDK tools  |  Android Developers

공식 다운로드 사이트 맨 아래 

Command line tools only 

라고 써져있는 다운로드 영역이 있다. Window 버전으로 설치한다.

 

그 이후, 환경변수에서 시스템 변수 추가를 하여

변수이름; ANDROID_SDK_ROOT

변수 값: C:\DEV\android-sdk\ [예시]

으로 설정한다.

android sdk 패키지를 업데이트 하기 위해서는 sdkmanager를 사용해야한다

<sdk>\latest\bin에서 커맨드를 열어

sdkmanage --update

를 사용하니 

Error: Could not determine SDK root.
Error: Either specify it explicitly with --sdk_root= or move this package into its expected location: <sdk>\cmdline-tools\latest\

와 같은 에러가 표시되었다. 이 경우 경로를 latest 디렉토리를 생성하여 잘라서 붙여넣는다.

이 후 다시

sdkmanager --update

sdkmanager --list

sdkmanager "platform-tools" "platforms;android-29" "build-tools;29.0.3"

위의 버전으로 구성하겠다. y/N 중 y라고 입력하고 진행한다.

android-sdk로 안드로이드 플랫폼 도구를 내려받았다.

flutter doctor --android-licenses

위의 내용을 터미널에 입력하여 결과가 "Unable to locate Android SDK."로 나타나면 

flutter config –android-sdk {path}

를 입력하고 다시 시도한다.

위와 같이, flutter doctor로 안드로이드 라이센스를 수락한다.

flutter doctor 를 입력하면,

모든 항목이 수락되어 보여진다.

sdkmanager --list

sdkmanager "system-images;android-29;google_apis_playstore;x86_64"

이후 시스템 이미지까지 내려받는다.

flutter emulator --create flutter_emulator

에뮬레이터를 생성하고,

flutter emulaotr --launch flutter_emulator

에뮬레이터를 실행시켜본다

The Android emulator exited with code 1 during startup
Android emulator stderr:
ERROR   | x86_64 emulation currently requires hardware acceleration!
CPU acceleration status: HAXM is not installed on this machine
More info on configuring VM acceleration on Windows:
https://developer.android.com/studio/run/emulator-acceleration#vm-windows
General information on acceleration: https://developer.android.com/studio/run/emulator-acceleration.

Address these issues and try again.

위와 같은 이슈가 생길시에는 https://developer.android.com/studio/run/emulator-acceleration#vm-windows

Android Emulator의 하드웨어 가속 구성  |  Android 개발자  |  Android Developers

위 해당 URL에 접속하여 HAXM를 설치한다.

https://github.com/intel/haxm/releases 경로에서도 설치할 수 있다.

아니면,

위의 그림과 같이 설정한다.

이후 VSCODE를 실행하여 flutter 프로젝트를 생성시킨다.

$flutter create flutter_web

$cd flutter_web

$flutter run -d chrome

#flutter run 명령어를 통해 실행할 디바이스(-d)를 chrome으로 설정해서 실행합니다.