Copyright 2016-2017 Moddable Tech, Inc.
Revised: November 25, 2017
This document provides an introduction to getting started building apps with the Moddable SDK. It describes how to configure the host build environments, install the required SDKs, drivers and development tools, build applications, and use xsbug, the JavaScript source code debugger.
The Moddable SDK requires macOS Sierra version 10.12 or newer and Xcode version 9 or newer.
-
Download and install Xcode. Launch Xcode to install additional command line components when prompted.
-
Download the Moddable repository, or use the
gitcommand line tool as follows:git clone https://github.com/Moddable-OpenSource/moddable -
Setup the
MODDABLEenvironment variable to point at your local Moddable SDK repository directory and edit thePATHenvironment variable in your~/.profileto include the build directory:export MODDABLE="/Users/<user>/Projects/moddable" export PATH="${MODDABLE}/build/bin/mac/release:$PATH" -
Build the Moddable command line tools, simulator, and debugger from the command line:
cd ${MODDABLE}/build/makefiles/mac make -
Launch the
xsbugdebugger from the command line:open ${MODDABLE}/build/bin/mac/release/xsbug.app -
Verify the host environment setup by building the starter
helloworldapplication for the desktop simulator target:cd ${MODDABLE}/examples/helloworld mcconfig -d -m -p mac
-
Complete "Host environment setup" for macOS.
-
Create an
espdirectory in your home directory at~/espfor required third party SDKs and tools. -
Download and install the Silicon Labs CP210x USB to UART VCP driver.
-
Download the esptool. Untar the package and rename the directory
esptool. Copy theesptooldirectory into the~/espdirectory. -
Download and untar the Xtensa lx106 architecture GCC toolchain. Copy the
toolchaindirectory into the~/espdirectory. -
Download the ESP8266 core for Arduino repository. Copy the extracted
esp8266-2.3.0folder into your~/espdirectory. -
Clone the ESP8266 SDK based on FreeRTOS repository into the
~/espdirectory:cd ~/esp git clone https://github.com/espressif/ESP8266_RTOS_SDK.git -
Connect the ESP8266 to your computer with a USB cable.
-
Verify the setup by building
helloworldfor theesptarget:cd ${MODDABLE}/examples/helloworld mcconfig -d -m -p esp
-
Complete "Host environment setup" for macOS.
-
Create an
esp32directory in your home directory at~/esp32for required third party SDKs and tools. -
Download and install the Silicon Labs CP210x USB to UART VCP driver.
-
Download the esptool. Untar the package and rename the directory
esptool. Copy theesptooldirectory into the~/esp32directory. -
Download and untar the ESP32 GCC toolchain. Copy the extracted
xtensa-esp32-elfdirectory into your~/esp32directory. -
Clone the
ESP-IDFGitHub repository into your~/esp32directory. Make sure to specify the--recursiveoption:cd ~/esp32 git clone --recursive https://github.com/espressif/esp-idf.git -
Update the
PATHenvironment variable in your~/.profileto include the toolchain directory:export PATH=$PATH:$HOME/esp32/xtensa-esp32-elf/bin -
Connect the ESP32 device to your macOS host with a USB cable.
-
Verify the setup by building
helloworldfor theesp32target:cd ${MODDABLE}/examples/helloworld mcconfig -d -m -p esp32
Note that the first time you build an application for the ESP32 target, the toolchain may prompt you to enter configuration options. If this happens, accept the defaults.
The Moddable SDK requires Windows 7 Pro SP1 or newer and Microsoft Visual Studio Community 2017 or newer.
-
Download Microsoft Visual Studio 2017 Community Edition installer. Launch the installer, choose the "Desktop development for C++" option and install.
-
Download the Moddable repository, or use the
gitcommand line tool as follows:git clone https://github.com/Moddable-OpenSource/moddable -
Setup the
MODDABLEenvironment variable to point at your local Moddable SDK repository directory:set MODDABLE=C:\Users\<user>\Projects\moddable -
Edit the system
PATHenvironment variable to include the build directory:%MODDABLE%\build\bin\win\releaseEnvironment variables should be set from the System Control Panel. The steps required vary depending on the Windows OS version.
-
Launch the "Developer Command Prompt for VS 2017" command line console. Build the Moddable command line tools, simulator, and debugger from the command line:
cd %MODDABLE%\build\makefiles\win build -
Launch the
xsbugdebugger from the command line:xsbug -
Verify the host environment setup by building the starter
helloworldapplication for the desktop simulator target:cd %MODDABLE%\examples\helloworld mcconfig -d -m -p win
-
Complete "Host environment setup" for Windows.
-
Create an
espdirectory in your home%USERPROFILE%directory, e.g.C:\Users\<your-user-name>. -
Download and install the Silicon Labs CP210x USB to UART VCP driver.
-
Download the esptool. Unzip the archive and copy the
esptool.exeexecutable from theesptool-0.4.12-win32directory into theespdirectory. -
Download and unzip the Cygwin toolchain support package. Copy the
cygwindirectory into theespdirectory. -
Download and unzip the Xtensa lx106 architecture GCC toolchain. Copy the
xtensa-lx106-elfdirectory into theespdirectory. -
Download the ESP8266 core for Arduino repository. Copy the extracted
esp8266-2.3.0folder into yourespdirectory. -
Connect the ESP8266 to your computer with a USB cable.
-
Launch the Windows Device Manager, open the "Ports (COM & LPT)" section, and verify the "Silicon Labs CP210x USB to UART Bridge" is displayed. Note the COM port (e.g. COM3) for the next step.
The Device Manager interface may vary depending on the Windows OS version.
-
Set the
BASE_DIRandUPLOAD_PORTenvironment variables to your%USERPROFILE%directory and device COM port:set BASE_DIR=%USERPROFILE% set UPLOAD_PORT=COM3 -
Edit the system
PATHenvironment variable to include thecygwin\bindirectory:%BASE_DIR%\esp\cygwin\bin -
Launch the "Developer Command Prompt for VS 2017" command line console. Verify the setup by building
helloworldfor theesptarget:cd %MODDABLE%\examples\helloworld mcconfig -d -m -p esp
The Moddable SDK has been tested on the Ubuntu 16.04 LTS (64-bit) and Raspberry Pi Desktop (32-bit) operating systems. These setup instructions assume that a GCC toolchain has already been installed.
-
Install the development version of the GTK+ 3 library:
sudo apt-get install libgtk-3-dev -
Download the Moddable repository, or use the
gitcommand line tool as follows:git clone https://github.com/Moddable-OpenSource/moddable -
Setup the
MODDABLEenvironment variable in your~/.bashrcfile to point at your local Moddable SDK repository directory:MODDABLE=~/Projects/moddable export MODDABLE -
Build the Moddable command line tools, simulator, and debugger from the command line:
cd $MODDABLE/build/makefiles/lin make -
Update the
PATHenvironment variable in your~/.bashrcto include the tools directory:export PATH=$PATH:$MODDABLE/build/bin/lin/release -
Install the Screen Test desktop simulator and xsbug debugger applications:
cd $MODDABLE/build/makefiles/lin make installWhen prompted, enter your
sudopassword to copy the application's desktop, executable and icon files into the standard/usr/share/applications,/usr/bin, and/usr/share/icon/hicolordirectories. -
Launch the xsbug debugger:
xsbug -
Verify the host environment setup by building the starter
helloworldapplication for the desktop simulator target:cd $MODDABLE/examples/helloworld mcconfig -d -m -p lin
-
Complete "Host environment setup" for Linux.
-
Create an
espdirectory in your home directory at~/espfor required third party SDKs and tools. -
Download the esptool compatible with your Linux host. Untar the package and rename the directory
esptool. Copy theesptooldirectory into the~/espdirectory. -
Download and untar the Xtensa lx106 architecture GCC toolchain. Copy the
toolchaindirectory into the~/espdirectory. -
Download the ESP8266 core for Arduino repository. Copy the extracted
esp8266-2.3.0folder into your~/espdirectory. -
Clone the ESP8266 SDK based on FreeRTOS repository into the
~/espdirectory:cd ~/esp git clone https://github.com/espressif/ESP8266_RTOS_SDK.git -
Connect the ESP8266 to your computer with a USB cable.
-
Verify the setup by building
helloworldfor theesptarget:cd $MODDABLE/examples/helloworld mcconfig -d -m -p esp
The xsbug JavaScript source level debugger is built as part of the Moddable SDK build described above. xsbug is a full featured debugger that supports debugging modules and applications for XS platforms. The xsbug debugger is automatically launched when deploying debug builds and connects to devices via USB or over Wi-Fi. Similar to other debuggers, xsbug supports setting breakpoints, browsing source code, the call stack and variables. The xsbug debugger additionally provides real-time instrumentation to track memory usage and profile application and resource consumption.
For additional details on
xsbugplease refer to the notes.md document in the KinomaJS open source repository.