It’s been a while since I’ve posted a NativeScript guide, so I decided to make it a point to write one for NativeScript on Windows. Many new folks start picking up NativeScript recently may found many obstructs of how to debug run NativeScript inside WSL, as official document didn’t have a dedicated section for this kind of setup.
I am doing development on both MacBook and my PC. Still I prefer and spend most of my time on PC. With WSL, I feel like living with the best of both worlds Ubuntu and Windows. I like multi-tasking, and my PC is such as powerhouse to have everything running in parallel during my coding time.
Setup for WSL basically should be same for Linux+Android mentioned in NativeScript official guide for setting up environment, which can be found at:
https://docs.nativescript.org/environment-setup.html#linux-android
Basically, we would need four things: Node, Java, Android SDK and Nativescript itself. Yet, there are some points that that is not straight forward for WSL. Today I would like to share my WSL setup, yet perfect for my NativeScript day-to-day development work.
1. Install Node.JS with NVM on WSL
NVM is a minimal tool to help managing multiple version of Node. Node keep updated often, with NVM you can jump between Node version without hassle. NVM can be installed as easy as:
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash
After nvm is installed, we can now install latest stable version of Node:
nvm install v16.14.2Just go ahead install NativeScript cli globally:
npm install -g nativescriptAfter installation is completed, you can now use ns command, but ns command will not be so useful yet at the moment as we still have some missing piece left to setup.
2. Install Java SDK on WSL
We need at least Java 8 to run Android SDK and build app. I prefer Java 11, which is LTS and still I need to use version this for other some Java projects. In WSL Ubuntu 20.04, it can be installed with bellow commands:
sudo apt update
sudo apt install openjdk-11-jdk3. Install Android SDK on WSL without GUI
We can install Android SDK with GUI, although it is possible to run GUI in WSL. I prefer command line version.
# Get the latest commandlinetools then extract it to "Android" directory in your home
wget https://dl.google.com/android/repository/commandlinetools-linux-8092744_latest.zip
mkdir -p ~/Android/cmdline-tools/
unzip commandlinetools-linux-8092744_latest.zip -d ~/Android/cmdline-tools
mv ~/Android/cmdline-tools/cmdline-tools ~/Android/cmdline-tools/latestUse your favorite editor, and add bellow 2 lines into your ~/.profile (you can create if it not existed)
export ANDROID_HOME=$HOME/Android
export PATH="$ANDROID_HOME/emulator:$ANDROID_HOME/tools:$ANDROID_HOME/tools/bin:$ANDROID_HOME/cmdline-tools/latest:$ANDROID_HOME/cmdline-tools/latest/bin:$ANDROID_HOME/platform-tools:$PATH"Refresh your current terminal environment by
source ~/.profileOr you can just close the current terminal and open a new one. After that, “sdkmanager” command should be now ready to use. Go ahead and install build-tools and platform tools with:
sdkmanager "build-tools;30.0.3" "platform-tools" "platforms;android-30" "tools"
sdkmanager --licensesThe last command will show any pending licenses needed to be accept before usage. Be sure to read and accept the terms with “Yes”. After download is completed, you will found many more directories created at your Android home directory like: platform-tools, tools, emulator, etc.
You can list all available versions by:
sdkmanager --listNativeScript require min version at least 23. At the moment I write this article, the latest platform version was 32 which I’m not confident yet to use at the time being. The minimum version needed for app to be accepted by Google Play store is 30.
You can always install newer version if you want. Just be sure to check if NativeScript already support that version in build chain, or you may running into “Cannot find a compatible Android SDK for compilation” on fresh installed machine that I wrote about earlier. API 30 is enough for me for now.
After install AndroidSdk successfully, try run:
ns doctorAnd see if everything is installed and properly configured. Then you can now start developing NativeScript app inside WSL.
4. Run NativeScript app on physical devices from WSL
adb command inside WSL will be not aware of physical devices that we plug into Windows. The easiest way I do so far is run a adb server on Windows, it will serve as a host, so our adb inside WSL can connect to and do it job remotely. (Although everything happened on your local machine only, nothing will leave the network).
4.1. First setup (do once)
Add bellow lines to your ~/.profile
export HOST_IP=$(awk '/nameserver / {print $2; exit}' /etc/resolv.conf 2>/dev/null)
export ADB_SERVER_SOCKET=tcp:$HOST_IP:5037
export NATIVESCRIPT_LIVESYNC_ADDRESS=$HOST_IPThe very first line is used to to find out your Windows machine’s IP. If you already have it somewhere, you can skip this first line. On next line we setup ADB_SERVER_SOCKET and NATIVESCRIPT_LIVESYNC_ADDRESS, which allow us to debug remotely from WSL. This method is not only applied to WSL, you can also use this method to remotely debug physical devices / emulator running on OTHER machine in your network. It pretty helpful for enterprise environment where we have a farm of devices that shared among employees.
You can find out more about above options at: https://blog.nativescript.org/nativescript-8-1-announcement/index.html
4.2. Run NativeScript inside WSL
As mentioned in above section, before we can run NativeScript inside WSL, we first need to start server on Windows side before we can use adb command properly inside WSL. To start server, run bellow command in cmd or powershell in Windows:
adb.exe -a -P 5037 nodaemon serverAfter run above command, adb server will be started. You will see something like this:
You can now try to plug in a physical devices into Windows, be sure to enable debug on your phone, then on WSL side try to:
adb devicesadb on WSL now detected my devices. Awesome!
Command like “ns run android” now should work fine, app will be installed and run on connected physical devices. Pro tips: You can also run emulators on Windows, it will be detected by WSL also as long as adb server is up and running. Whatever adb on Windows see, WSL also see it.
Summary
For code editor, I will leave it up to your choice. Myself prefer using VIM and Visual Studio Code. The only main reason I use Code is because of Github Co-pilot 😂, I found this robot dude is pretty helpful when trying to implement some general logic. Hope they will make VIM version soon.
And here is it, my WSL setup for NativeScript development. Hope that with this guide, help you to run NativeScript inside WSL. I’m not an expert, but I do development on my Windows machine almost everyday. So any strange happen with this setup, possibly I have found a workaround for it. Feel free to ask me any questions related to WSL and NativeScript.