Debugging a Custom Widget Locally

TagoIO Dashboards
1

Hi guys,

I created a custom widget to show a bar chart. I remember that we can start it from VS Code using npm start, forward the port, and connect the custom widget to debug and display the data in the console. However, mine only shows the loading screen.

image
image846×717 43.7 KB

image
image346×169 3.79 KB

image
image1828×103 5.53 KB

image
image420×226 7.15 KB

image
image810×637 6.59 KB

Could someone help me?

2

Hi @geovane.silva

If VSCode Forward Port isn’t working, I recommend using ngrok to expose your local app. Here’s how:

  1. Install ngrok (you’ll need a free account):
    :backhand_index_pointing_right: Official Getting Started Guide

  2. Start your local server as usual, e.g.:

    npm run dev

  3. Open a tunnel with ngrok (replace 1234 with your app’s port):

    ngrok http http://localhost:1234

  4. The terminal will show a public link like:

    https://abcd-1234.ngrok-free.app

    Use this link on the custom widget.

3

Thanks for your response! I tested it with ngrok and it works.