LoginSignup
2
1

More than 1 year has passed since last update.

Moddable SDKの開発環境構築を自動化するxs-devツールを試してみた。(macOS編)

Last updated at Posted at 2023-03-09

はじめに

Moddable SDK 3.6.0のリリースノートに記載されていたModdable SDKの開発環境構築を自動化するxs-devツールを試してみました。

xs-devツールのインストール

Node.jsがインストールされていない場合は、最初にNode.js v14以上をインストールします。
Node.jsのサイトへアクセスし、推奨版のソフトウェアをダウンロードします。

スクリーンショット 2023-03-09 14.44.32.png

ダウンロードしたファイル(pkgファイル)を実行してインストールします。
インストールが完了したらターミナルを開き、以下のコマンドで動作を確認します。

$ node -v
v18.14.2
$ npm -v
9.5.0

Node.js v14以上がインストールされている場合は、npmコマンドでxs-devツールをインストールします。

$ npm install -g xs-dev

以下のコマンドで動作確認します。

$ xs-dev -v
0.23.0

xs-devツールを更新する場合は、以下のコマンドを実行します。

$ npm update -g xs-dev

Moddable SDKの開発環境の構築

前提条件

  • Intel MacBook Pro (2017)
  • macOS Big Sur (バージョン 11.7.4)
  • Xcode (バージョン 13.1)
  • Homebrew

XcodeとCommandLineToolsがインストールされている必要があります。
XcodeのインストールとCommandLineToolsの設定は以下のページで確認できます。

Homebrewがインストールされていない場合は、以下のコマンドでインストールします。

$ /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)"

Moddable SDKのセットアップ

以下のコマンドを実行します。

$ xs-dev setup
ℹ Downloading release tools
✔ Getting latest Moddable-OpenSource/moddable release
✔ Installing xsbug-log dependencies
✔ Moddable SDK successfully set up! Start a new terminal session and run the "helloworld example": xs-dev run --example helloworld

デフォルトではModdable SDKの最終リリースバージョンがインストールされるため、GitHubのメインブランチをインストールする場合は、以下のコマンドを実行します。

$ xs-dev setup --target-branch public

セットアップが完了すると、.bashrcに以下のコマンドが追加されます。

source /Users/kitazaki/.local/share/xs-dev-export.sh

コマンドを実行するか、ターミナルを閉じて新しく開きます。
※ 以下のエラーが表示されますが、問題ありません。ESP32デバイスのセットアップ後は表示されません。

-bash: /Users/kitazaki/.local/share/esp32/esp-idf/export.sh: No such file or directory

以下のコマンドでインストール後の環境を確認します。

$ xs-dev info
xs-dev environment info:
  CLI Version                0.23.0                                        
  OS                         Darwin                                        
  Arch                       x64                                           
  NodeJS Version             v18.14.2 (/usr/local/bin/node)                
  Python Version             3.9.6 (/opt/local/bin/python)                 
  Moddable SDK Version       3.7.6 (/Users/kitazaki/.local/share/moddable) 
  Supported target devices   mac 

以下のコマンドでサンプルプログラム(helloworld)を実行します。

$ xs-dev run --example helloworld

ESP32デバイスのセットアップ

以下のコマンドでESP32デバイスのビルドツール(ESP-IDF)をインストールします。

$ xs-dev setup --device esp32
ℹ Ensuring esp32 install directory
✔ Cloning esp-idf repo
✔ Installing pyserial through pip3
⠼ Installing esp-idf toolingDetecting the Python interpreter
Checking "python" ...
⠦ Installing esp-idf toolingPython 3.9.6
"python" has been detected
Installing ESP-IDF tools
⠇ Installing esp-idf toolingCurrent system platform: macos
Creating /Users/kitazaki/.espressif/idf-env.json

(中略)

⠸ Installing esp-idf toolingAll done! You can now run:

  . ./export.sh

✔ Installing esp-idf tooling
ℹ Sourcing esp-idf environment
✔ 
  Successfully set up esp32 platform support for Moddable!
  Test out the setup by starting a new terminal session, plugging in your device, and running: xs-dev run --example helloworld --device=esp32
  If there is trouble finding the correct port, pass the "--port" flag to the above command with the path to the /dev.cu.* that matches your device.

以下のコマンドでインストール後の環境を確認します。

$ xs-dev info
xs-dev environment info:
  CLI Version                0.23.0
  OS                         Darwin
  Arch                       x64
  NodeJS Version             v18.14.2 (/usr/local/bin/node)
  Python Version             3.9.6 (/Users/kitazaki/.espressif/python_env/idf4.4_py3.9_env/bin/python)
  Moddable SDK Version       3.7.0 (/Users/kitazaki/.local/share/moddable)
  Supported target devices   mac, esp32
  ESP32 IDF Directory        /Users/kitazaki/.local/share/esp32/esp-idf 

ESP32デバイスの接続ポート番号を確認する

M5StickC Plusを接続した例

$ xs-dev scan
✔️ Found the following available devices!
  Port               Device             Features
  /dev/cu.usbserial-09535D631E   ESP32-PICO-D4 (revision 1)   WiFi, BT, Dual Core, 240MHz, Embedded Flash, VRef calibration in efuse, Coding Scheme None

ESP32デバイスでサンプルプログラムを実行する

M5StickC Plusでサンプルプログラム(helloworld)を実行する例

$ xs-dev run --example helloworld --port /dev/cu.usbserial-09535D631E --device esp32/m5stick_cplus
⠴ Building and deploying project /Users/kitazaki/.local/share/moddable/examples/helloworld on esp32/m5stick_cplus

M5StickC Plusでボールデモ(piu/balls)を実行する例

$ xs-dev run --example piu/balls --port /dev/cu.usbserial-09535D631E --device esp32/m5stick_cplus
⠴ Building and deploying project /Users/kitazaki/.local/share/moddable/examples/piu/balls on esp32/m5stick_cplus
2
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
1