Syntax Highlighting for Visual Studio Code


my currently favorite editor is visual studio code. I use the following configuration for the syntax highlighting in the rules, sitemap and items files.

// Place your settings in this file to overwrite default and user settings.
    "files.associations": {
        "*.rules": "javascript",
        "*.sitemap": "javascript",
        "*.items": "javascript"

     "javascript.validate.enable": false

certainly it is not the correct highlighting and I have to disable the validation, but for me it is very useful.

Here a screenshot:

I look forward to your opinions and suggestions for improvements :slight_smile:

1 Like

Just a word of warning. Designer does a ton more than just syntax highlighting, including syntax validation as you type. The arcane nature OH exceptions means that debugging simple syntax errors like unmatched curly brackets or a typo in an Item name can take hours to debug whereas Designer will tell you immediately. It also can code completion with <ctrl><space> which helps one discover/remember the methods that are on various Items saving one the need to look things up.

So my suggestions would be, if you are serious about using an editor outside of Designer, to see if you can recreate these capabilities. Without that you might be setting yourself up for frustration in the future. Maybe keep Designer around as a debugging tool (i.e. when it doesn’t work load everything into Designer to check everything for syntax errors).

Thanks. I have to agree with them, so I have to give the designer a new chance. The last time a stuggled with a high cpu load. The autocomplete feature was not usable and i feel like in a featureless eclipse ide. I worked for many years with eclipse but for “simple” text editing, the visual studio code is much faster and also cross platform compatible.

I used to use Eclipse SmartHome Designer two years now. I am not a programmer so it was great help for me the syntax error checking from this program.
With Visual Studio Code what i have to install to have the same help? except Openhab extension( i already did it)…

You just need to install and configure the openHAB extension per the instructions. You also need to have openHAB running and where ever you are running VSCode needs to be able to access port 5007 on the machine where openHAB is running.

VSCode uses the exact same software that openHAB uses when it loads a .rules file through the Language Server Protocol service running inside of openHAB.

I did all of this. My problem now is the 5007 port , I cant open it . I make rule on windows firewall and Norton. and finally on router. but still closed. any suggestion>?

A fully funcional openHAB should have this line in openhab.log during startup:

2018-06-05 10:45:08.495 [INFO ] [thome.model.lsp.internal.ModelServer] - Started Language Server Protocol (LSP) service on port 5007

2018-06-06 10:23:19.872 [INFO ] [thome.model.lsp.internal.ModelServer] - Started Language Server Protocol (LSP) service on port 5007
ok I got this. Need to open this port to my PC(win10) too>?
I see conf file from my raspb via network share

It depends on your security setup … which we don’t know. I did not have to open any port on my firewall, router or whatever to make it work.
Make sure you have the “Problems” tab open: you won’t see the syntax errors in your code like Smarthome Designer, you need to open “View” “Problems” tab.
Take a look at the screenshots:

Problems tab can be seen here:

Also make sure you are opening the conf folder of your openHAB instance, not individual files.