vscode에서 flutter의 kotlin, swift 코드 환경 구성
1. 개요
플러터를 개발하는데 최고의 ide는 안드로이드 스튜디오라고 생각했다.
그런데 이제 다르다.. vscode의 자동완성 성능이 많이 좋아졌으며 플러그인을 통해 xcode와 android studio를 거의 대체가 가능한 수준으로 되었다.
2. 기본적인 환경구성
먼저 아래의 두 익스텐션이 필요하다
일단 두개를 설치해주자
3. 자동완성이 잘 되도록 하기
두 익스텐션을 설치해도 네이티브 코드를 만지다 보면 자동완성이 잘 되지 않는다.
kotlin
먼저 코틀린의 경우 하단에 스테이터스 바에 kotlin 언어버튼을 누른다.
그럼 audo detect가 뜨는데 이걸 자동완성 될 때 까지 여러번 갈겨준다.
그러다보면 gradle 어쩌구 설정하시겠습니까 라는 알림창이 뜰때 ok를 눌러준다. 그 이후 안드로이드 스튜디오 까지는 아니지만. 자동완성이 잘 되는걸 볼 수 있다. 개인이 작성한 코드정도 까지는 잘 찾고 완성도 잘 되지만 네이티브 sdk까지는 잘 안된다.
Swift
swift도 kotlin과 똑같이 auto detect를 여러번 갈겨준다.
하지만 얘는 추가적으로 더 설정이 필요하다.
f1을 눌러 커맨드 팔레트를 열고 swift로 검색한다. 그러면 아래와 같은 두개의 설정이 있다
Swift: Select Toolchain -> Xcode로 설정
Swift: Select Target Platform -> ios나 macos로 현재 네이티브 코드 설정
위 두개를 하면 vscode로 간단한 네이티브 코드 작업은 가능하다.
다만 xcode나 android studio만큼 완벽하지는 않다.
4. ide만큼 sdk 까지 자동완성이 되되록 하려면?
android의 경우 Extension Pack for java라는 익스텐션이 필요하고
ios의 경우 SweetPad라는 익스텐션이 필요하다
Extension Pack for Java
먼저 아랫놈을 설치해주자
대충 6개 묶어서 설치해줌. 저기서 RedHat java가 조금 말썽을 일으키는데 문제가 생기면 추후 삭제 해 주자. 내가 시스템에 설치한 자바를 쓰지 않고 자꾸 저놈이 몰래 설치한 자바가 튀어나와서 말썽을 일으킨다.
1. 앱을 플러터 워크스페이스에서 한번 빌드해준다.
2. 마지막으로 안드로이드 폴더를 열어주면 gradle이 sync되면서 sdk부분까지 완벽하게 자동완성을 지원해준다.
대충 여기까지 시행착오 다 겪어본 결과 위 방법으로 대부분 완벽하게 돌아간다.
여기까지 완료되면 gradle task가 gradle 패널에 쫙 보이는데 엄청 편하다
+gradle, sdk, jdk tool chain를 지정하는 파일 경로 위치는?
그냥 알아두면 좋을 지식. gradle의 경우 gradle/gradle-wrapper.properties
sdk는 local.properties
jdk는 local.properties에 정의되거나 프로젝트의 .gradle파일 안에 혹은 홈폴더의 .gradle에 정의되어있다.
jdk tool chain은 안드로이드 스튜디오 열어서 바꾸자...
또 AGP와 관련하여 에러가 나면 setting.gradle의 com.android.application의 버전을 바꿔주자
요약하면
gradle => gradle-wrapper.properties
AGP => setting.gradle의 com.android.application
SweetPad
vscode에는 사실 sweetpad라고 xcode를 대체하려는 프로젝트가 있다.
이를 이용하면 vscode에서 xcode급 개발환경을 구축할 수 있다.
익스텐션을 설치해준다.
1. 프로젝트 열기
원래는 ios플젝을 열어야 하는데 그냥 안드로이드 폴더도 포함되는 flutter 프로젝트 폴더 열어도 상관없다.
2. 빌드서버 설치
아래 커맨드로 xcode build server를 설치한다
brew install xcode-build-server --head
3. 워크스페이스 지정
다음으로 커맨드 팔레트를 열어 워크스페이스를 지정해준다
Runner.xcworkspace로 설정
4. build 서버 config 만들기
아래 커맨드를 실행하면 json파일이 하나 만들어진다.
5. 앱 한번 빌드하기
아래 커맨드로 앱한번 빌드하자. 이제 자동완성이 xcode급으로 잘 동작한다.
--------------아래부터는 과거 삽질 내역임
Android Full Support
얘는좀 불편하다. android 프로젝트를 꼭 열어줘야함.
아래 익스텐션을 설치해준다.
아래 manage sdk를 누르면 알아서 sdk 찾아서 환경세팅 다 해준다. 그래들 빌드가 완료되면 apk 빌드 및 디바이스 설치에 관한 설정이 나온다. 디바이스 설치는 아쉽게도 실행까지 안시켜줌..
${ANDROID_SDK_ROOT}
sdk위치는 위 방식대로 찾아오므로 rc파일에 환경설정을 ANDROID_SDK_ROOT로 꼭 해주자
마주친 문제. gradle 문제가 발생한다면?
회사 맥북에서는 문제가 없었는데 집에있는 맥북에서는 gradle 빌드에 문제가 계속 생겼다.
두가지 문제를 겪었다.
1. 자바버전 문제
2. gradle 버전 문제
일단 제일 중요한점은 플러터 workspace에서 한번 빌드를 해야 한다는점!
생각보다 플러터 워크스페이스에서 네이티브 워크스페이스로 뭔가 전달을 많이한다.
자바 버전문제로그가 계속 떴는데 내 맥북에 깔린 자바를 가져다 쓰는게 아닌 .vscode안에 redhat의 1.8 버전을 계속 가져다 쓰고 있었다.
.vscode안으로 들어가서 해당 자바버전 날리니 맥북에 깔린거 가져다 쓰게되었다.
문제 원인을 찾아보니 gradle을 자기가 알아서 설치된거 찾아서 사용하는데 내 맥북에는 옛날 gradle이 쌓여있어서 그거 가져다 쓰다가 계속 에러가 났음.
해결방법은 먼저 홈폴더에 있는 .gradle 폴더를 삭제하여 캐시를 비우고 brew install gradle로 원하는 버전 gradle을 설치해주면 그거 가져다가 쓰는거 같다.
내부적으로 도는 로직
위 익스텐션을 공부하다 보니 내부적으로 gradle for java를 쓰고 있다. 고로 사실상 이 패키지만 있어도 상관없는듯. Android Full Support를 지우고 gradle for java만 사용해도 안드로이드 프로젝트를 열면 코끼리 모양의 gradle 탭이 뜬다.
회사 맥북에는 gradle을 따로 설치하지 않았다. 그럼 어디에 있는 gradle을 가져다 쓰는가?
android/gradle/gradle-wrapper.properties에 정의되어 있다. 저기 숫자만 바꿔도 위에처럼 따로 설치하지 않아도 그래들 버전을 바꿀수가 있다.
대충 모든걸 요약하면 아래 스크린샷으로 설명할 수 있다.
1. Extension java pack을 설치하면 프로젝트 구조를 파악하여 이게 gradle 프로젝트인지 아닌지 판별하고 gradle 프로젝트이면 좌측 하단에 코끼리가 하나 나온다.
2. 이 코끼리를 클릭하면 gradle 프로젝트 구조를 보여주고, Run a gradle build 버튼을 클릭하면 커맨드 팔레트에 gradle 인풋값을 넣어줄 수 있다.
3. 여기다가 예시문처럼 build라고 치면 gradle 빌드가 되는 구조이다.
