Skip to main content

Buildling For Roku

Deployment​

See Transpiler License And Tool Setup for instructions on downloading, installing, and licensing the Hosanna Transpiler.

  1. Transpile the project: 
    npm run transpile
  2. Deploy and run using the [ROKU] target.

Debugging​

Use breakpoints for debugging. Errors and crashes appear in the console, synced with source maps.

Hosanna debugger Chrome extension​

This extension allows you to debug Roku applications directly in your browser, allowing you to inspect and modify the state of your Roku application in real-time. The extension works both on the Roku device and in the Roku simulator.

To use the Hosanna debugger extension:

  1. Install the Hosanna debugger extension from the Chrome Web Store.
  2. When debugging using the extension, be sure to start the npm task: npm run device-debug-proxy, to allow the extension to connect to your Roku device.
  3. Configure the ip address of the machine where you ran the device-debug-proxy in your debug-flags.(dev|prod|qa).json file(s), so that debugged code can connect to the chrome extension.

Limitations​

  • BrightScript REPL uses m instead of this.

  • BrightScript debugger is slow and crash-prone.

  • Transpiled code may differ (e.g., thing.get_foo() instead of thing.foo)

  • Here are some helpful tips:

    • Use get_foo() for getters
    • Use set_foo(value) for setters
    • Use getField('name') for state values, or observable fields

🔧 Struct Generator​

Hosanna UI uses a custom generator to create boilerplate code for views, tasks, and components. This generator ensures consistency, reduces manual coding effort, and helps you follow best practices.

The generator produces "struct" files that:

  • Define state fields and methods for each Hosanna component.
  • Create utility methods for easy, declarative instantiation of components.
  • Help maintain type safety and code clarity.

How to use the generator:

  • Start the generator in watch mode: 
    npm run generate-watch
  • Remove generated files: 
    npm run clean-generated

Note: If you run the WEB launch target (i.e, launch the [WEB] launch target in your IDE), the struct generator is automatically started in watch mode. You do not need to run generate-watch manually for web development.

For more details on struct files and advanced usage, see the dedicated documentation in the guides section.