In this article

• Autocomplete for *.meta & ubConfig
• Code style (Standard JS)
• Code quality (ESLint)
• Code Autocomplete
• Debugging
  • Install FireFox extension for VSCode
  • Create a Launch configuration
  • Adding a manifest
  • Run ub in developer mode
  • Start debugging in VSCode
  • Read debugging manual
  • Debugging tips
• For contributors

Autocomplete for *.meta & ubConfig

We provide a JSON Schemas in a @unitybase/ub package for meta files, server and scheduler configurations. To configure a VSCode for schema support:

• press Ctrl+Shift+P, type Workspace and select Preferences: Open Workspace Settings
• copy config provided below to the settings.json

{
    "files.associations": {
        "*.meta": "json"
    },
    "json.schemas": [{
        "fileMatch": [
            "*.meta"
        ],
        "url": "https://unitybase.info/models/UB/schemas/entity.schema.json"
    }, {
        "fileMatch": [
            "ubConfig*.json"
        ],
        "url": "https://unitybase.info/models/UB/schemas/ubConfig.schema.json"
    }, {
        "fileMatch": [
            "_schedulers.json"
        ],
        "url": "https://unitybase.info/models/UB/schemas/scheduler.config.schema"
    }]
}

This will associate *.meta with JSON file format and set validation schema`s for meta, ubConfig &schedulers.

More about settings - in official VSCode doc

Code style (Standard JS)

We recommend to use a JavaScript Standard Style. Just install a extension and add a Set "javascript.validate.enable": false in VSCode settings.json to disable VSCode built-in validator

Code quality (ESLint)

Install a vscode-eslint extension. Install standard as a dev dependency. Optionally (if you use Vue - install eslint-plugin-vue

npm i --save-dev standard eslint-plugin-vue

Create .eslintrc file in the root of your project and paste there

{
  "extends": [
    "plugin:vue/recommended",
    "standard"
  ]
}

Code Autocomplete

JavaScript Code Autocomplete in VSCode is broken by Microsoft - IDE support only a subset of JSDoc specification - see a Embrace, extend, extinguish for a reasons). So, welcome to a proprietary world :(

Debugging

Starting from version 4.1-beta7 UnityBase support debugging of server-side directly from a VSCode IDE using VS Code Debug Adapter for Firefox

Install FireFox extension for VSCode

Press Ctrl+Shift+X type Firefox and select extension Debugger For FireFox by Holger Benl

Create a Launch configuration

For UB server >= 5.11

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "firefox",
            "request": "attach",
            "name": "UB",
            "host": "127.0.0.1",
            "port": 6000,
            "sourceMaps": "client"
        }
    ]
}

For UB server < 5.11

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "firefox",
            "request": "attach",
            "name": "SyNode",
            "addonType": "webExtension",
            "addonPath": "${workspaceFolder}/",
            "host": "127.0.0.1",
            "port": 6000,
            "sourceMaps": "client"
        }
    ]
}

Adding a manifest

Since UB can run multiple JS Engine, we need to add a configuration with an engine name we want to debug.

Place the new manifest.json file at the folder specified in addonPath above (practically - close to the package.json file). It should contain the following content:

{
	"applications": {
		"gecko": {
			"id": "Server"
		}
	}
}

Possible values of the "id" property above are:

• "id": "Server" to debug a server-side thread
• "id": "client" to debug a console thread (command line js executed by >ub myscript.js -dev - debug)
• "id": "WebSocket" to debug a server-side WebSocket thread

Run ub in developer mode

!!! Please, disable a WebSocket (comment a wsServer section in ubConfig.json) before debugging - debugging with enabled WebSockets don't work yet

Run UB in developer mode to allow debugger

cd yourAppFolder
ub -dev

Start debugging in VSCode

In VS Code press F5 to connect to a UB Remote Debugger. In case you got a error This debugger currently requires add-ons to specify an ID in their manifest - see [Adding a manifest] section above.

You can set a breakpoints in IDE before start a debugger or during debugging.

Read debugging manual

Debugging tips

You can modify a sources you debug, but this changes are applied to server only after restart.

You can restart a server directly from debugging console by typing $$() command - see picture

For contributors

In case you need to debug a debugger protocol - add a logging section to the launch.json

"configurations": [
        {
            ....
            "log": {
                "consoleLevel": {
                    "PathConversion": "Debug",
                    "default": "Debug"
                }
            }