M1 및 fish 셸을 사용하여 NativeScript 환경 구축(macOS) 시작

NativeScript용 애플리케이션 개발 구축 환경

목표

NativeScript를 사용하여 JS와 TS에서 응용 개발을 진행하고자 합니다.

안드로이드 스튜디오 등 방대한 IDE를 설치하고 싶지 않습니다.

필요한 포장만 골라 환경을 구축하자.

컨디션

Mac OS 12.0.1 Monterey

ARM(M1)

fish shell

node v16.14.0

Java가 설치되지 않음

Android Studio가 설치되지 않음

NativeScript 설치

특별히 비틀림 없이 npm에 NativeScript를 설치합니다.

$ npm i -g nativescript

NativeScript 프로젝트 만들기

셸을 다시 시작합니다.

$ exec $SHELL -l

문서에 따라 프로젝트를 제작합니다.

$ ns create myCoolApp

선택하면 Angllar,React,Vue,Svelte로 초기화할 수 있습니다.

$ ns create myCoolApp --angular    // or --ng for short
$ ns create myCoolApp --vue
$ ns create myCoolApp --vue --ts   // for vue with typescript
$ ns create myCoolApp --react
$ ns create myCoolApp --react --ts // for react with typescript
$ ns create myCoolApp --js
$ ns create myCoolApp --svelte

프로젝트에 들어갑니다.

$ cd myCoolApp

그렇게 시동을 걸면 혼나요.

안드로이드를 특별히 준비하지 않은 개발 환경에서 시작을 시도하면 대량의 분노 메시지가 발생한다.
일단 해보자.

$ ns run android

많은 것들이 나왔잖아요.
여기서부터 움직여.

Java 가져오기

Azul M1에 해당하는 JDK를 나눠주고 있으니 구해주세요.
JDK18을 설치했습니다.
설치하기 전에 최선을 다하세요.
그리고 java.com와 oracle.com의 JDK가 닮았다안 쓰는 게 좋을 것 같아요..

안드로이드 SDK 환경 조정

안드로이드 스튜디오를 설치하고 GUI를 간단하게 조작하면 환경 조정이 가능할 것 같지만 저는 자바와 Kottlin을 특별히 쓰고 싶지 않아서 NativeScript의 환경만 조정하면 될 것 같아서 최소한으로 설정했습니다.
여기.command-line-tools의 최신 버전을 내려놓으세요.

$ sudo mkdir /opt/android-sdk
$ sudo chown [ユーザーネーム]:staff /opt/android-sdk
$ unzip [落としてきたやつ].zip
$ mv cmdline-tools /opt/android-sdk

조금 중요한 절차가 있어요.

여기서는 아무 생각 없이 /opt/android-sdk/cmdline-tools/bin 패스를 통과하면 귀찮아진다.
진짜 할 줄 알아요.
이거 잘해야 돼./opt/android-sdk/cmdline-tools 아래에 latest라는 폴더를 만들어서 /opt/android-sdk/cmdline-tools/binlatest로 이동합니다.
뭐랄까, 바로 이런 일이다./opt/android-sdk/cmdline-tools/latest/bin이렇게 하면 아마 문제가 없을 것이다.

Android SDK 경로

완료되면 경로를 통해 환경 변수를 설정합니다.
~/.config/fish/config.fish

# 以下を追記
set -gx ANDROID_HOME /opt/android-sdk

# パスを通す
$ set -U fish_user_paths /opt/android-sdk/cmdline-tools/latest/bin $fish_user_paths

케이스를 다시 시작하고 사용 여부를 시도합니다.

$ exec $SHELL -l
$ sdkmanager

사용할 수 있을 것 같아요.(사용할 수 없는 사람은 실수로 불평하세요. 죄송합니다.)

sdkm 관리자에 필요한 포장

sdkmanager 파라미터를 주면 해당하는 포장을 다운로드합니다.

$ sdkmanager "platform-tools" "build-tools;30.0.2" "emulator" "extras;intel;Hardware_Accelerated_Execution_Manager" "platforms;android-31" "sources;android-31"

30.0.2라고 쓰여있는build-tools 버전만 있으면 글을 읽을 때최신판가 좋습니다.
마지막에adb지령을 사용하지 못하면 욕platform-tools을 먹고 통과하면 완성됩니다.

$ set -U fish_user_paths /opt/android-sdk/platform-tools $fish_user_paths

/opt/android-sdk/의 최종 디렉터리 구조는 이런 느낌이다.

NativeScript로 돌아가 액션 확인

$ tns doctor android #確認用コマンド

괜찮으면 NativeScript 초기화된 디렉터리로 이동하여 시작합시다!

$ ns run android

수고하셨습니다~✨