Rule Flow Editor VS Code Extension

This VS Code extension provides a visual rule flow editor integrated into your development environment.

Features

• Visual rule flow editing within VS Code
• Integration with existing Angular application
• Webview-based editor interface
• Command palette integration

Usage

• Open the command palette (Ctrl+Shift+P)
• Type "Open Rule Flow Editor"
• The editor will open in a new panel

Development

1. Run npx ng build rule-flow-editor
2. Run npm install to install dependencies
3. Run npm run compile to build the extension
4. Press F5 to open a new Extension Development Host window

Add the following to your .vscode/launch.json for debugging:

{
  "version": "0.2.0",
  "configurations": [
    {
      "args": [
        "--extensionDevelopmentPath=${workspaceFolder}/apps/rule-flow-editor/vscode-extension"
      ],
      "name": "Launch Extension",
      "outFiles": ["${workspaceFolder}/apps/rule-flow-editor/vscode-extension/out/**/*.js"],
      "request": "launch",
      "type": "extensionHost"
    }
  ]
}

Package and publish

1. Run npm run package to package and prepublish
2. Publish a pre-release: npm run publish
3. Or log in marketplace(https://marketplace.visualstudio.com/) to publish

Installation

1. Install the generated .vsix file in VS Code
2. Install from market

Project

apps/rule-flow-editor/vscode-extension

Architecture

The extension consists of:

• Main extension entry point (src/extension.ts)
• Webview provider for the editor interface
• Integration with the existing Angular rule-flow-editor application