node-red-contrib-super-config

A centralized configuration node for Node-RED with Monaco editor autocomplete, type hints, and real-time value preview.

Define your configuration once — get IntelliSense everywhere.

Features

• Autocomplete in Function nodes — type cfg. and see all config keys with descriptions and live values
• Nested objects — config supports arbitrary depth (cfg.email.smtp.host)
• Environment variables — use ${ENV_VAR} in any string value, resolved automatically at deploy time
• Visual tree editor — add/remove/nest keys directly in the node UI
• JSON editor — switch to raw JSON editing with one click
• Type safety — generates TypeScript interfaces injected into Monaco editor

Installation

Via Node-RED Palette Manager

1. Open Node-RED
2. Go to Menu → Manage Palette → Install
3. Search for node-red-contrib-super-config
4. Click Install

Via npm

cd ~/.node-red
npm install node-red-contrib-super-config

Restart Node-RED after installation.

Quick Start

1. Add the node

Drag super config from the palette onto your flow. You'll find it in the Super Config category.

2. Define your configuration

Double-click the node to open the editor:

| Key | Type | Value | Description | |-------------|--------|--------------------------|----------------------| | email | object | | Email service config | | → host | string | ${SMTP_HOST} | SMTP server host | | → sender | string | [email protected] | Default sender | | apiToken | string | ${API_TOKEN} | External API token | | debugMode | boolean| false | Enable debug logging | | allowedRoles| array | ["admin","editor"] | Permitted roles |

3. Deploy

Click Deploy. The config is written to context and types are generated.

4. Use in Function nodes

/** @type {SuperConfig} */
const cfg = global.get("config");

const smtpHost = cfg.email.host;      // autocomplete works here
const sender = cfg.email.sender;       // hover shows description + value
const token = cfg.apiToken;

After deploy, refresh the browser (F5) to load updated type definitions. Then autocomplete will show all your config keys with descriptions and real values on hover.

Value Types

| Type | Description | Example value | |---------|------------------------------------------|----------------------------| | string | Text value. Supports ${ENV_VAR} syntax | https://${API_HOST}/v1 | | number | Numeric value | 8080 | | boolean | true or false | true | | array | JSON array | ["admin","user"] | | object | Nested object with child keys | (use tree editor) |

Environment Variables

Any string value containing ${VAR_NAME} will be automatically resolved from environment variables at deploy time.

Value: https://${API_HOST}/api/v1
Result: https://production.example.com/api/v1

If the variable is not set, the ${VAR_NAME} placeholder remains as-is.

Scope

| Scope | Access in Function nodes | |--------|------------------------------| | Global | global.get("config") | | Flow | flow.get("config") |

JSON Editor

Click the JSON button in the node editor to switch to raw JSON editing mode. Format:

{
  "email": {
    "_type": "object",
    "_desc": "Email service config",
    "_children": {
      "host": {
        "_type": "string",
        "_desc": "SMTP server host",
        "_value": "${SMTP_HOST}"
      }
    }
  },
  "debugMode": {
    "_type": "boolean",
    "_desc": "Enable debug logging",
    "_value": "false"
  }
}

How Autocomplete Works

The node generates TypeScript interface definitions from your config structure and injects them into the Monaco editor using two mechanisms:

1. addExtraLib injection — types are injected into Monaco when the editor opens
2. func.d.ts append — types are written to Node-RED's built-in type definition file

After deploy + browser refresh, writing /** @type {SuperConfig} */ before global.get("config") enables full autocomplete with descriptions and live values.

Requirements

• Node-RED >= 2.0.0
• Monaco editor (default in Node-RED since v2.0)

License

MIT