Setting up External Editor with a New Widget

New in WidgetStudio 2.0 is the ability to use an external editor to write and edit the web-language code. This functionality gives experienced widget developers the chance to use a full-featured IDE and to organize their files as they wish.

Setting up a New Widget

As you go to create a new widget, you can direct the coding to be done in Visual Studio Code or another editor. WidgetStudio has tighter integration with VSCode, but any editor can be used.


To get started:

  • Create a new widget. 
  • Then go into "External Editor Mode"

  • Once this mode is activated, you can set up the project to be written in the external editor. Continue by first selecting or creating the folder location for the files.

This process will do two things.

  • First, it will check to see if there's an "index.html" file in the folder. If not, it will ask you if you want to create it. You can choose to do so or not. If you choose to not create the file, you will have to create (or copy) a file of the same name into this folder.
  • Second, the process will create two additional WidgetStudio files: "config.json" and "data.json". These are needed for WidgetStudio's structure.

Now you're ready to write the widget in an external Editor. You can open these files in an editor of your choise or use Visual Studio Code. In WidgetStudio, there's a button to auto-open these files in VSCode.