본문 바로가기
Programming/Flutter

[Flutter] Mac에 Flutter 개발환경 설치하기

by SpiralMoon 2019. 8. 31.
반응형

 주제 : Mac에 Flutter 개발환경 설치하기.

 

▶  작성 환경

▷ OS : Mac

▷ IDE : Android studio 3.5 이상 (또는 Intellij IDEA 2019.1.2 이상)

 

▶  작업 순서

▷ 1. Intellij IDEA 또는 Android studio 설치 

▷ 2. Flutter plugin과 SDK 설치

▷ 3. Android 개발환경 설정

▷ 4. iOS 개발환경 설정

 

▶  1. Intellij IDEA 또는 Android studio 설치

 

Flutter 어플리케이션을 제작하기 위한 IDE를 설치해야한다. 보통은 Android studio나 VS Code를 사용한다.

참고로 말하자면 Android studio에서도 Flutter iOS 앱 개발이 가능하니 혹시나 개발이 안될거라고 생각하는 사람은 맘 놓고 Android studio를 깔아도 되겠다.

 

Download : https://developer.android.com/studio

 

Download Android Studio and SDK tools  |  Android Developers

developer.android.com

위 링크로 들어가 프로그램을 설치한다.

 

▶  2. Flutter plugin과 SDK 설치

 

Android studio에서 플러터 코드를 개발/빌드 하려면 SDK가 필요하고 Android studio에 플러그인이 설치되어 있어야 한다.

다행스럽게도 플러그인을 설치하면 SDK까지 자동으로 설치해준다. (SDK는 웹사이트에서 직접 다운받는 것도 가능)

 

그리고 Dart SDK는 같이 Flutter SDK 내부에 포함되어 오니 따로 설치할 필요는 없다.

 

▷ Android studio에서 Flutter 플러그인 설치

Flutter 플러그인은 Android stutio에서 flutter 앱 개발을 할 수 있도록 지원해주는 확장 프로그램인데, 설치 시 SDK까지 자동으로 셋팅해준다.

Android studio를 열고 하단의 Configure를 클릭

Plugins 클릭

flutter 검색 후 Install 누르고 설치가 완료되면 Android studio를 재시작한다.

메뉴에 Start a new Flutter project가 생겼다! 눌러보자.

SDK가 간단하게 설치되었다!

 

▷ (SDK만 따로 설치하는 경우) Flutter 사이트에서 직접 다운받아 설치

 

이전 챕터를 진행했으면 할 필요 없다. SDK만 별도로 원하거나 이전 챕터에서 SDK가 정상적으로 설치되지 않았을 경우에 진행하자.

 

Download : https://flutter.dev/docs/get-started/install/macos

 

MacOS install

 

flutter.dev

위 링크에서 zip 파일을 다운하고

$ cd #
$ vi .bash_profile

vi로 .bash_profile를 연 다음

export PATH="$PATH:/Users/username/Documents/SDK/flutter/bin"

위 처럼 .bash_profile에 flutter SDK의 주소의 등록하고 터미널을 재시작.

flutter --version을 입력 했을 때 성공적으로 출력이 된다면 성공!

 

▶  3. Android 개발환경 설정

 

Android SDK와 JDK를 설정하고 에뮬레이터(선택사항)를 설치하면 된다.

Tools > SDK Manager를 열어서 Android SDK Manager 실행

SDK가 이미 설치되어 있다면 해당 주소를 넣어주면 되고 없으면 Edit를 눌러서 설치 페이지로 이동

설치가 끝나면 자동으로 Android SDK가 설정된다.

 

JDK는 Android stuido를 설치했다면 내장으로 들어있으니 따로 설정하지 않아도 된다.

하지만 Intellij를 사용하는 사람이면 JDK가 설정이 안되어 있을 수 있는데 이런 경우에는 JDK 1.8(Java 8)을 인터넷에서 설치하여 위 사진의 + 버튼을 누르고 주소를 추가해주면 된다.

반드시 1.8로 깔도록 하자... 다른 버전은 안해봤는데 일단 JDK 12는 지원하지 않는다.

 

안드로이드폰이 있으면 USB로 연결해서 바로 개발해도 되고,

안드로이드폰이 없으면 메뉴에서 AVD Manager를 실행하여 가상 안드로이드 시뮬레이터를 설치하고 개발하면 된다.

 

Android 개발환경 설정은 마무리 되었다.

 

▶  4. iOS 개발환경 설정

 

App Store에서 Xcode를 설치한다.

iOS 빌드는 Xcode를 통해서만 가능하기 때문에 반드시 설치 해주어야 하며, Android studio에서 iOS 빌드를 할 수 있는 이유는 내부적으로 Xcode의 기능을 이용하도록 되어있기 때문이다. (이건 Xamarin 할 때 Visual studio와 Xcode가 둘 다 필요한 이유와 같음)

 

터미널을 열고 flutter doctor를 입력한다. 만약 Xcode에 CocoaPods가 설치되지 않았다는 오류 메시지가 뜨면

$ sudo gem install cocoapods
$ pod setup

을 입력하여 설치 해준다.

 

아이폰이 있으면 USB로 연결해서 바로 개발해도 되고,

아이폰이 없으면 Xcode > Preferences > Components에서 원하는 버전의 Simulator를 설치한 후 개발하면 된다.

iOS 개발환경 설정은 마무리 되었다.

 

▶  개발환경 상태 보기

 

$ flutter doctor

이 문서를 잘 따라왔다면 터미널을 열고 마지막으로 위 명령어를 실행해서 X 표시가 있는지 확인한다.

 

X 표시가 없으면 모든 설정이 정상적으로 완료된 것이고,

X 표시가 있으면 해당 오류메시지에 나온 설명대로 설정을 고쳐야 한다.

 

▶  관련 문서

▷ Flutter for Mac : https://flutter.dev/docs/get-started/install/macos

반응형

댓글