Local development environment for VMP mini-apps: run on the workstation, inspect Host API traffic, and preview on a device through Mini Dev.
A Mini App ID is not required for local development. On a mobile device, the mini-app runs inside the VMP application (session, location, and storage come from that application). On the workstation, the session uses mock identity and coordinates.
Getting started
Open Visual Studio Code on a mini-app project folder. The folder MUST contain package.json. Alternatively, use Create mini-app project or Open project folder on Home.
Mini App ID is optional for local execution. Bind an ID on Home before deployment, and when the VMP application must resolve this project.
Open Develop. Select an execution target, then press Start. Press Stop to terminate the session. The Simulator frame, QR code, and browser window appear only while the session is active.
Execution targets
Target
On Start
On Stop
Simulator (VS Code)
Device frame is displayed. USER / LOCATION are supplied by the mock configuration.
Frame is dismissed. Session terminates.
Phone (Mini Dev)
QR code is issued. Open Mini Dev in the VMP application on the same Wi-Fi network and scan. Generic camera applications and web browsers MUST NOT be used.
QR code is dismissed. Session terminates.
Chrome Debugger
Google Chrome launches with DevTools. If Chrome is not installed, the session MUST NOT start; a warning and download action are presented.
Session terminates. The Chrome window created by the extension is closed.
Edge Debugger
Equivalent to Chrome Debugger, using Microsoft Edge.
Session terminates. The Edge window created by the extension is closed.
Default browser
The preview URL opens in the system default browser.
Session terminates. The browser tab MUST be closed manually.
Mock identity and location
The workstation has no VMP production session. Configure:
Field
Host API
userId
USER.GET_USER_INFO
access token
USER.GET_ACCESS_TOKEN (development use only; MUST NOT be treated as a production token)
Press Apply while Simulator is running to update values without restarting the session. Phone (Mini Dev) ignores this configuration and uses the live VMP session and location.
Inspector
After Start, VMP Inspector records:
View
Contents
Host API
Invocations from the mini-app (USER.*, STORAGE.*, …)
Console
console.log / warn / error from mini-app JavaScript
Network
fetch and XMLHttpRequest issued by mini-app JavaScript. Document, image, and stylesheet requests are excluded.
Storage
Local boxes after storage writes
Phone (Mini Dev) requirements
The workstation and the device MUST join the same Wi-Fi network.
On Develop, select Phone (Mini Dev) and press Start.
In the VMP application, open Mini Dev and scan the QR code.
If Start cannot resolve an IPv4 address, connect the workstation to Wi-Fi and retry.
Generic camera applications and web browsers MUST NOT be used to scan the QR code.
