플러터 개발환경 세팅을 해보겠습니다. 개인적으로는 React Native 세팅보다 훨씬 쉬운거같습니다.

참고로 제 환경은 아래와 같습니다.

  • flutter version: 2.8.1-stable
  • macOS: 11.6 Big Sur (intel)
    • 애플 실리콘(M1)의 경우 로제타를 깔아야 합니다 (링크 참조)

 

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

위 문서 보고 쭉 따라하면 됩니다.

 

Prerequisite

  • Android Studio
  • Xcode
  • Chrome

전부 깔아줍니다

이상태에서 한 한시간 기다려야 설치됨 💢

참고로 Xcode 설치시간 엄청 오래걸리니까 제일 먼저 설치해주세요

 

flutter 다운로드 및 세팅

먼저 위 문서 링크에서 Flutter SDK를 다운로드 받습니다. 그 다음 압축을 풀고, 플러터 폴더 안의 bin을 PATH에 추가합니다.

참고로 플러터 안에 dart sdk 내장돼있어서 dart는 따로 설치하지 않아도 됩니다.

 

전 이런식으로 ~/development/flutter 요기로 옮겨놨습니다.

export PATH="$PATH:/Users/유저명/development/flutter/bin"

.zshrc(또는 .bashrc 등)에 위 한줄 추가해준 뒤 쉘을 재시작하고 echo $PATH 입력했을 때 flutter/bin 경로가 나오면 된겁니다.

 

flutter doctor

그 다음, 위 명령어를 입력합니다. 대개는 이렇게 나올건데, 전부다 초록색 체크로 나와야 세팅이 완벽하게 된겁니다.

노란 느낌표나 엑스표시의 경우 뭐가 없거나 그런건데, 설명까지 친절하게 나옵니다. 전부 해결해줍니다.

  • cmdline-tools component is missing
    • 안드로이드에서 Android SDK Command-line Tools를 설치해줍니다 (⬇️ 아래서 설명)
  • Android license status unknown.
    • `flutter doctor --android-license`를 입력해줍니다
  • Xcode installation is incomplete; ...
    • 앱스토어에서 Xcode를 깔아줍니다
    • xcode 설치후 "Once installed, run: ..." 밑에 나와있는 명령어 두개를 입력합니다
      • sudo xcode-select --switch /Applications/Xcode.app/Contents/Developer
      • sudo xcodebuild -runFirstLaunch
  • CocoaPods not installed
    • gem으로 설치하라고 나오는데, 그러면 오류가 나옵니다
    • 그냥 무시하고 brew install cocoapods로 설치하면 됩니다.

안드로이드 스튜디오에서 android sdk command-line tools 받으려면 "Preferences - Appearance & Behavior = System Settings - Android SDK"에서 "SDK Tools" 탭에서 설치 가능합니다.

 

이렇게 나오면 준비완료입니다

 

이제 os별, ide별 세팅만 해주면 됩니다

 

iOS 세팅

 

macOS install

How to install on macOS.

docs.flutter.dev

위 링크대로 해주시면 됩니다

전 아직 iOS 배포는 안할 생각이라 스킵했습니다

 

안드로이드 세팅

안드로이드 스튜디오 Preferences - Plugins에서 플러터, 다트 플러그인을 검색해서 설치해줍니다

 

예시로 프로젝트 열어본 모습입니다.

AVD(Android Virtual Device) 설정을 해줘야 하는데요, "Tools - AVD Manager"에서 설정할 수 있습니다.

 

노치 있는 모델인 픽셀 3 XL로 골라서 빌드해본 모습입니다.

반응형