관리 메뉴

나만을 위한 블로그

[Flutter] 안드로이드 스튜디오에 플러터 설치하는 법 [2022 Ver] 본문

개인 공부/Flutter

[Flutter] 안드로이드 스튜디오에 플러터 설치하는 법 [2022 Ver]

참깨빵위에참깨빵 2021. 7. 28. 15:45
728x90
반응형

※ 이 포스팅은 21.07.28 기준으로 윈도우 환경에서 작성됐다.

※ 22.11.05 업데이트

이 포스팅을 따라하기 전에 자바 환경변수 설정과 안드로이드 SDK 환경변수 설정이 되어 있어야 한다. 이 환경변수 설정 방법은 이 포스팅에서 설명하지 않는다.

 

먼저 아래 홈페이지에서 플러터 설치 파일을 다운받는다.

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

 

Install

Install Flutter and get started. Downloads available for Windows, macOS, Linux, and Chrome OS operating systems.

flutter.dev

 

사이트로 들어가면 이런 화면이 나온다.

 

컴퓨터 OS에 맞게 클릭해주자. 글 처음에 말한 대로 윈도우 기준으로 설명한다.

 

 

22.11.05 기준으로 3.3.7 버전을 다운받을 수 있다.

용량이 850MB를 조금 넘어서 다운받는 데 시간이 조금 걸릴 수 있다.

 

그 시간에 안드로이드 스튜디오로 들어가서 설정 창을 연 뒤 plugins 탭에 들어간다. 그리고 플러터 플러그인을 설치한다.

플러그인 홈페이지를 보면 알겠지만, 플러터 플러그인을 깔면 Dart 언어 플러그인도 자동으로 설치된다.

 

22.11.05 기준 플러트 71.0.2 버전이 설치된다

 

그리고 플러터 공식 홈페이지에서 다운받은 파일을 압축 해제한다. 경로는 본인 입맛에 맞게 편한 곳에다 하자. 난 C 드라이브에 압축 해제했다.

압축을 풀면 폴더 안에 들어있는 건 아래와 같다.

 

 

여기서 bin 폴더에 들어간 다음 탐색기 경로를 복사해둔다. 그리고 cmd로 들어가서 cd 입력 후 복사한 경로를 붙여넣기한 뒤 엔터 쳐서 이동한다. 내 경우엔 아래와 같이 복사됐다.

 

 

그리고 "flutter doctor" 라고 입력한다. 그럼 아래 화면이 나온다.

 

 

빨간 X와 함께 "flutter doctor --android-licenses"를 입력하라는 문구가 보인다.

이걸 그대로 입력했더니 난 이런 에러를 볼 수 있었다.

 

 

빨간 사각형 안에 표시된 에러를 구글링하니 해결법이 많이 있었다. 난 아래 포스팅을 참고해서 진행했다.

https://falaner.tistory.com/79

 

[플러터 오류] Exception in thread "main" java.lang.NoClassDefFoundError: javax/xml/bind/annotation/XmlSchema 해결하기

- flutter doctor 터미널에 flutter doctor 를 입력하면 다음과 같이 현재 설치 환경에 대한 정보를 확인할 수 있다. 위 사진을 보면 한가지 부분에 [!] 가 되어 있는 것을 볼 수 있고 위 부분에 대한 것은 '

falaner.tistory.com

 

이 글에 설명된대로 설치하고 적용한 다음, 다시 "flutter doctor"를 입력하자 보이는 게 조금 달라졌다.

 

 

그리고 다시 "flutter doctor --android-licenses"를 입력했다. 그러자

 

 

y를 입력하라는 화면이 나왔다. 이후로 9번 정도 y를 눌러야 한다. 동의 안하면 설치 못할 게 뻔하니...

마지막 y를 누르면 아래 화면이 나온다. 아직 cmd는 끄지 말고 내버려둔다.

 

 

설치가 다 끝났다는 말 같다. 이제 안드로이드 스튜디오로 돌아가면 Create New Flutter Project라는 글자가 보인다.

테마는 내가 별도로 다운받아서 배경색이 좀 다르지만 신경쓸 필요 없다.

 

 

저걸 누르면 안드로이드 스튜디오 4.2.2 버전으로 아래 화면이 나왔다.

 

 

플러터 SDK가 설치된 경로를 입력하라는 것 같다.

오른쪽의 ... 버튼을 눌러 처음에 압축 해제했던 경로 중 flutter 폴더가 위치한 경로까지만 입력한 다음 next를 누르면 이 화면이 나온다.

 

 

프로젝트 이름을 지을 때 안드로이드처럼 단어의 첫 글자들을 대문자로 써봤는데 이런 에러가 나온다.

 

 

그래서 소문자로 쓰고 단어 사이에 언더바를 붙여서 프로젝트를 만들었다.

잠시 로딩이 지난 후 이 화면이 나왔다.

 

 

main.dart 파일은 lib 폴더 안에 존재하니 참고하자.

android와 ios 안에 각각 폴더들이 따로 존재하는데, 안드로이드 폴더 안을 타고 들어가 MainActivity.java를 여니 이런 에러가 나온다.

 

 

아마 설정을 따로 해야 하는 게 있는데 하지 않아서 그런 것 같다.

그리고 왼쪽 폴더 트리 맨 밑 부분에 pubspec.yaml 파일이 있는데, 이걸 더블클릭하면 우측 상단에 Flutter doctor라는 글자가 보인다.

 

 

 

이 안에 들어가서 우측 상단을 보면

 

 

이걸 눌러주면 하단에 뭔가 글자들이 올라온다.

만약 여기서 Android Studio not found라는 에러가 발생할 경우 안드로이드 스튜디오가 설치된 경로를 입력하면 된다.

위에서 말한 대로 cmd를 아직 종료하지 않았다면 flutter 폴더의 bin을 보고 있을 것이다. 이 상태에서 아래 명령어를 입력해준다.

 

flutter config --android-studio-dir="C:\안드로이드 스튜디오 설치 경로"

 

이렇게 한 후 pubspec.yaml 파일을 끄고 다시 킨 다음, Flutter doctor를 누르면 모든 항목이 체크돼 있고 No issues found! 라는 문장이 나올 것이다.

 

 

이렇게 나온다면 끝이다.

 


 

22.11.05 추가)

 

만약 플러터를 막 설치하고 안드로이드 소스코드를 수정하려 android 안의 main > kotlin > 패키지명 폴더 안의 MainActivity를 확인하면 이렇게 나올 수 있다.

 

 

이것은 File > Open을 눌러서 플러터 프로젝트 안에 있는 android를 실행하면 해결된다.

 

 

안드로이드가 이런 식이라면 맥북에서 iOS 프로젝트를 실행할 때도 비슷하게 하면 되지 않을까 싶다.

반응형

'개인 공부 > Flutter' 카테고리의 다른 글

[Dart] 함수(Function) 알아보기  (0) 2023.05.07
[Dart] mixin이란?  (0) 2023.04.30
[Flutter] BuildContext란? Widget이란?  (0) 2023.01.24
[Dart] 자료형  (0) 2022.11.12
[Dart] Dart란?  (0) 2022.11.11
Comments