NativeScript установка на Kubuntu

Об подводных камнях: чтобы установить NativeScript на Kubuntu без проблем, вам нужно точно следовать этой инструкции, для того чтобы установить необходимые версии JDK, Node.js и npm. Это важно потому, что различные версии могут привести к проблемам со сборкой в NativeScript, поэтому я рекомендую установить JDK 15.0.2 не ниже и не выше, а Node.js можно 16+. Если у вас установлена Kubuntu 18.04, то вам следует обратите внимание, на то что там версия Node.js актуальнее 16.x.x не установится (похоже есть проблемы с совместимостью), а версия младше 16 может привести к использованию неподходящей версии npm, та что нужна, должна быть не ниже 8.x.x. NativeScript это не про HTML/CSS/JS это про XML/CSS/JS (на это заблуждения по началу попался я).

Node.js и npm

Для того, того чтобы установить Node.js и npm не ниже 8.19.3, я использовал менеджер версий Node.js, такой как nvm. Хороший гайд по установке Node.js на Ubuntu 18.04 через nvm можно найти здесь. Хочу еще раз обратить внимание, что для Kubuntu 18.04 необходимо установить версию Node.js не ниже 16.x.x и не выше.

У меня уставлены следующие их версии.

node -v
v16.19.0

npm -v
8.19.3

JDK 15.0.2

Для установки JDK 15.0.2 на Kubuntu вам нужно выполнить несколько шагов.

1. Скачайте JDK 15.0.2 deb пакет (если у вас есть ARM-процессор, то загрузите tar.gz.) с официального сайта Oracle или зеркала.

2. Установите этот deb пакет, это можно сделать либо с помощью графического установщика, либо через консоль, например так.
sudo apt install ~/Downloads/jdk-19_linux-x64_bin.deb

Для ARM-процессоров, нужно использовать следующие команды:

sudo mkdir -p /usr/lib/jvm
sudo tar -zxf ~/Downloads/jdk-19_linux-aarch64_bin.tar.gz -C /usr/lib/jvm/

3. Создайте символические ссылки для исполняемых файлов, используя команду update-alternatives.
sudo update-alternatives --install /usr/bin/java java /usr/lib/jvm/jdk-15.0.2/bin/java 1
sudo update-alternatives --install /usr/bin/javac javac /usr/lib/jvm/jdk-15.0.2/bin/javac 1
sudo update-alternatives --install /usr/bin/jar jar /usr/lib/jvm/jdk-15.0.2/bin/jar 1

4. Выберите JDK 15.0.2 по умолчанию (нужно вести соответствующею цифру и подтвердить), используя команду update-alternatives.
sudo update-alternatives --config java
sudo update-alternatives --config javac
sudo update-alternatives --config jar

Проверьте правильность этой настройки, выполните команду в терминале:

java -version
javac -version

Здесь должна выводиться информация связанная с 15 версией

5. Создайте файл конфигурации «kate /etc/profile.d/jdk.sh», и добавьте в него следующие строки:
export J2SDKDIR=/usr/lib/jvm/jdk-15.0.2
export J2REDIR=/usr/lib/jvm/jdk-15.0.2
export PATH=$PATH:/usr/lib/jvm/jdk-15.0.2/bin:/usr/lib/jvm/jdk-15.0.2/db/bin
export JAVA_HOME=/usr/lib/jvm/jdk-15.0.2
export DERBY_HOME=/usr/lib/jvm/jdk-15.0.2/db
Сохраните.

6. Создайте файл конфигурации для другой оболочки, например «kate /etc/profile.d/jdk.csh», и добавьте в него следующие строки:
setenv J2SDKDIR /usr/lib/jvm/jdk-15.0.2
setenv J2REDIR /usr/lib/jvm/jdk-15.0.2
setenv PATH ${PATH}:/usr/lib/jvm/jdk-15.0.2/bin:/usr/lib/jvm/jdk-15.0.2/db/bin
setenv JAVA_HOME /usr/lib/jvm/jdk-15.0.2
setenv DERBY_HOME /usr/lib/jvm/jdk-15.0.2/db
Так же сохраните.

7. Сделайте оба файла исполняемыми.
sudo chmod +x /etc/profile.d/jdk.csh /etc/profile.d/jdk.sh

8. Перезагрузите систему и проверьте настройки переменной JAVA_HOME с помощью команды:
echo $JAVA_HOME

Если все сделано правильно, вы должны увидеть /usr/lib/jvm/jdk-15.0.2.

Android Studio и NativeScript

Для разработки приложений на NativeScript под Android необходимо установить специальное ПО - Android Studio. Если вы еще не установили его, следуйте следующим шагам:

1. Скачайте Android Studio с официального сайта.
2. Распакуйте скачанный архив в любое удобное для вас место (у меня это «~/app/android-studio»).
3. Запустите Android Studio, откройте консоль и перейдите в папку bin/. В моем случаи это будет выгладить так.
cd ~/app/android-studio/bin
./studio.shЕсли выберете ручной режим, следите чтобы SDK Manager был в списке.
4. Открываем файл «~/.bashrc».

kate ~/.bashrc

Прописываем там в самом конце нужные переменные.

export ANDROID_HOME=$HOME/Android/Sdk
export PATH=$PATH:$ANDROID_HOME/platform-tools

Сохраняем и перезапускам консоль.
5. После установки Android Studio необходимо установить SDK для Android. Для этого откройте настройки SDK Manager (во вкладке Projects нажмите на выпадающем списке «More Actions» и выберите «SDK Manager»).

6. В окне настроек SDK Manager выберите вкладку SDK Platforms и установите нужную версию Android для разработки. Я выбрал версию 10.0.

7. Теперь необходимо установить NativeScript, для этого выполните команду.
npm install -g nativescriptОбратите внимание, что не рекомендуется устанавливать NativeScript с правами суперпользователя.
8. После установки выполните проверку перед использованием, запустив команду.
ns doctor android9. Если все галочки зеленые, значит, вы установили все, что нужно для начала работы.

NativeScript проверяем работу

После того, как мы уставили и настроили нужным образом NativeScript, осталось проверить его работоспособность и создать готовый файл apk.

Так как процессор моего компьютера не поддерживает стандартный эмулятор Android, начнем с готового файла apk. Для этого с начало нужно будет создать приложение под названием «HelloWorld» (либо может использовать своё, на ваше усмотрение), вот так можно будет сделать это:

ns create  HelloWorld

Дальше, отвечаем выбором на первый вопрос «Plain JavaScript», а на второй - «Hello World». Затем перейдем в папку с приложением (в нашем случае это будет «HelloWorld/»):

cd HelloWorld/

Теперь нужно создать ключи, используя команду:

keytool -genkeypair -alias aliasNameKey -keyalg RSA -keysize 2048 -validity 10000 -keystore pathNameKey.jks

При этом необходимо ввести пароль (его можно вставить Ctrl+Shift+V и потом Enter). В качестве примера мы используем пароль d412k1125J128.

Далее переходим к созданию билда. Вот как выглядит команда для этого:

tns build android --release \
  --key-store-path <path-to-your-keystore> \
  --key-store-password <your-key-store-password> \
  --key-store-alias <your-alias-name> \
  --key-store-alias-password <your-alias-password>

Если вам это не о чем не говорит, то коротко можно сказать, что это консольный аналог опции «Build» => «Generate Sined Bundle / APK...», в Android Studio.

Вернемся к нашему примеру и воспользуемся полученными знаниями:
tns build android --release --key-store-path pathNameKey.jks --key-store-password d412k1125J128 --key-store-alias aliasNameKey --key-store-alias-password d412k1125J128По итогу у нас должен получиться готовый apk файл (путь к файлу будет указан в консоли), который можно будет установить на свой смартфон с подходящей версией Android. Если у вас есть нужный аппарат, вы можете передать на него этот apk файл и установить его.

Теперь проверим отладку, для этого нужно подключить, ваш телефон к компьютеру и установить приложение на него, используя команду:

tns run android

Если ошибок не будет, то ей можно будет заняться, к примеру до следующего Ctrl+С отключения.

Если что-то не получиться, то учтите, что на реальном устройте должен быть включен режим отладки, который настраивается в режиме разработчика, проверить это можно с помощью

tns device

В таблице под словом Status, должно быть значения Connected.

Если там какое-то другое значение, можете попробовать не отключая кабель от компьютера. Снова выключить и включить режим отладки, в режиме разработчика, мне это помогло.

Есть так же другой вариант, который позволяет не подключать смартфон к компьютеру через кабель, это можно сделать помощью альтернативной команды «tns preview». Для этого необходимо выполнить данную команду:

tns preview

Затем установить на телефон приложение «NativeScript Preview», авторизоваться к примеру через google.com и отсканировать появившийся QR-код в консоли. После чего приложения загрузит в свой контейнер необходимые файлы из вашего и перезапуститься. А дальше можно будет так же заниматься отладкой. Для завершения в консоли вам будет достаточно нажать Ctrl+С. А для сброса контейнера нужно вызвать на значке путем долгого удержания соответствующею опцию меню на которую надо будет нажать и тогда данные контейнера сбросятся.

На заметку: и в том и другом случаи, при сохранении например какова-нибудь файла в «<имяПриложения>/app/» директории, изменение практически тут же отображают на реальном устройстве.

На этом с проверкой установки все, теперь вы готовы к разработке приложений под Android с помощью Android Studio и NativeScript. Успехов!