DOCS / GETTING STARTED

Hot reload & shipping

The same RootView serves both lives of your plugin: a watched bundle file during development, an embedded string in the shipped binary.

Development — watch the file

With watchForChanges = true, the RootView polls the bundle’s modification time every 250ms. Run bun run watch, save a component, and the running plugin tears down the JS runtime and remounts in about 100ms — inside the DAW, without closing FL Studio, Ableton, or your standalone build.

terminal 1 — UI

cd ui && bun run watch

terminal 2 — plugin (once)

cmake --build build --target MyPlugin_VST3 --config Debug
# open the DAW, load the plugin, then just keep saving TSX

Production — embed the bundle

Ship a single binary with zero loose files: embed the bundle with JUCE’s BinaryData and pass it as bundleSource. A CMake option is the usual switch between the two modes:

CMakeLists.txt

option(MYPLUGIN_DEV "Load the UI bundle from disk and watch it" OFF)

juce_add_binary_data(MyPluginAssets SOURCES ui/build/main.js)
target_link_libraries(MyPlugin PRIVATE MyPluginAssets)

target_compile_definitions(MyPlugin PRIVATE
    MYPLUGIN_DEV=$<BOOL:${MYPLUGIN_DEV}>)

PluginEditor.cpp

#if MYPLUGIN_DEV
    options.bundleFile = juce::File (MYPLUGIN_UI_BUNDLE_PATH);
    options.watchForChanges = true;
#else
    options.bundleSource = juce::String::fromUTF8 (BinaryData::main_js,
                                                   BinaryData::main_jsSize);
#endif

Fallback behavior

When bundleFile is empty or missing on disk, the RootView automatically falls back to bundleSource — so a dev build still boots after you delete the build folder, and a misconfigured path never ships a blank window.