Switching from the ECL IDE to the VS Code with the ECL Language Extension

More and more people are switching from the ECL IDE to the VS Code ECL Language Extension. Reasons for switching vary, from VS Code being more responsive when coding with very large repositories, to wanting to edit and submit ECL code on a Mac or on Linux, or simply liking the “dark” mode option offered with the VS Code editor. Whatever the case, if you have been an avid user of the ECL IDE and want to give the VS Code version a spin, then this article is for you.

Why VS Code?

VS Code (Visual Studio Code) is a product of Microsoft and has quickly become the editor of choice for many programmers around the world. Besides working on the Windows, Mac, and Linux operating systems, the editor provides many powerful developer tools like intellisense code completion and debugging right out of the box. VS Code is light-weight and has extensive support for the most popular computer languages such as javascript, JSON, HTML, python, C++, C#, java, and PHP. And as of October 2018, ECL is now included in the supported list of VS Code language extensions with many ECL programmers permanently switching from the ECL IDE to VS Code.

Downloading

Here is the direct download link: https://nas/content/live/hpccsystems.visualstudio.com/download. Install it as you normally would for any application on your current platform.

VSCode IDE Layout

Become familiar with the VS Code IDE interface. This will help when talking to others when using the VS Code ECL language Extension. The interface is divided into 5 sections:

  • Activity Bar
    This  is where you will find special functionalities for both VS Code in general, and VS Code extensions specifically.
  • Side Bar
    Contains list panels including files, search results, and special extension lists
  • Editor Groups
    The main editing area where files can be found which are listed in a tab format across the top of the work area. VS Code is sensitive to what language file is being displayed and changes is colorization and right-click context menu accordingly.
  • Panel
    The location for terminal entry as well as added information including debug listings and special lists and displays for specific extensions.
  • Status Bar
    Located at the bottom, which contains both generic VS Code editor information as well as specific information and clickable lists and buttons.

VSCode Layout

Configuring Servers

Once you download and open up VS Code, you need to do two things:

Open your ECL repository folder

  1. Click File.
  2. Choose Open Folder and navigate to your repository folder.

Create a configuration for each target cluster

There are several ways you can start this process. Choose one of the following methods:

  1. Click Configure ECL Launch in the lower right corner.
  2. Click the Run and Debug triangle located on the Activity Bar and click the create a launch/json file link (located under the Run and Debug button).
  3. Create a launch.json file in the Explorer side bar under the .vscode folder and then click Add Configuration, located in the bottom right corner of the Editor Groups area.

Once you click on Add Configuration in the launch.json window, you will be prompted to choose the type of configuration. Choose ECL, as shown here:

Add configuration

To create a configuration for a new server, click on Add Configuration in the lower right corner of the launch.json file editor in the Editors Group. You are prompted to choose a configuration type. Choose either ECL http or https types.

Here is a configuration for the ECL Playground area which is publicly available:

Configuration file

Submitting ECL

To submit ECL to a server, the server must be available. The triangle submit button is found in the top tab of the Editor Groups area at the right top. If the server is not available, the submit button will be grayed out and there will be an “x” next to the server name on the left-hand side of the status bar, located at the bottom of the VS Code interface.

Once you have submitted a file, a progress bar appears on the bottom right of the Editor Groups. Results will be displayed in the Panel and ECL Watch can be opened for the workunit displayed by clicking on the globe icon located in the title bar of the Panel. Results can also be displayed by clicking on the workunits shown in the bottom list of the Side Panel under the name of the server.

Work Unit

Work Unit

ECL Bundles and Client Tools

Click on the HPCC Systems icon in the Activity Bar to display the available ECL Bundles and Client Tools. ECL Bundles and Client Tools take time to load so be patient. Once loaded, bundles can be loaded and unloaded and the version of the client tools can be selected using these lists in the HPCCSystems Side Bar.

Work Unit

Work Unit

There is a right-click context menu in the file tabs for ECL and KEL files with many of the same functions ECL IDE users will recognize.

Right Click

ECL Watch

The biggest difference between the Windows ECL IDE and the VS Code ECL Language Extension is that ECL Watch is opened in a separate browser whereas the ECL IDE has a fully functioning embedded web browser. The designers of VS Code wanted to keep it exclusively as a computer code editor and to avoid extensions relying heavily or almost exclusively on an embedded browser. So they have purposely limited displaying HTML, using very rudimentary formatting functions which means even not allowing hyper-link functionality. None-the-less, power users of the VS Code version of the ECL editor have not found this to be a problem.

Two important keyboard shortcuts

There are two important keyboard shortcuts for VS Code:

  • Control-j
    Toggles the display of the Panel, which is helpful when you want more space in the Editor Groups.
  • Control-Shift-p
    Brings up the process commands which allows you to enter commands directly. If you then type “ecl”, you will see a list of ECL commands which can be invoked directly from the keyboard. Another useful command is “Developer: Reload Window” which reloads VS Code and resets everything which can be useful when in stuck states.

A few last words…

Entire teams have made the switch from the Window’s ECL IDE to the cross platform VS Code and have not looked back. The light-weight aspect, the cross-platform capability, as well as the much-desired “dark mode” has made it more and more popular with ECL coders with well over 10,000 downloads of the extension to date.

The biggest question we get at HPCC Systems is will we be making a permanent switch to the VS Code version and dropping the windows ECL IDE? The quick answer is no. But with more and more people making the switch to the VS Code version, it may be wise to get to know this fast-growing ECL Language Extension, which has some distinct advantages over the ECL IDE.

Learn more using these resources: 

*************************

Photo of David de Hilster

David de Hilster  is a Consulting Software Engineer on the HPCC Systems Development team and has been a computer scientist in the area of artificial intelligence and natural language processing (NLP) working for research institutions and groups in private industry and aerospace for more than 30 years. He earned both a B.S. in Mathematics and a M.A. in Linguistics from The Ohio State University. David has been with LexisNexis Risk Solutions Group since 2015 and his top responsibility is the ECL IDE, which he has been contributing to since 2016. David is one of the co-authors of the computer language NLP++, including its IDE VisualText for human language called NLP++ and VisualText.

David can frequently be found contributing to Facebook groups on natural language processing. In his spare time, David is active in several scientific endeavors and is an accomplished author, artist and filmmaker.