We're excited to announce the first release of the BoxLang Monaco Editor Support - a comprehensive language support package that brings BoxLang syntax highlighting, IntelliSense, and custom theming to Monaco Editor, the powerful code editor that powers Visual Studio Code.
What is this?
The boxlang-monaco-editor package provides everything you need to integrate BoxLang development capabilities into web-based applications. Whether you're building an online IDE, a documentation site with interactive examples, or any application that needs code editing capabilities, this package makes it easy to provide a first-class BoxLang development experience.
Script Support
Templating Support
Key Features
🎨 Full Syntax Highlighting
Complete support for both BoxLang script files (.bx, .bxs) and template files (.bxm) with intelligent highlighting for:
- BoxLang components and functions
- Control flow structures
- String interpolation
- Mixed HTML/BoxLang template syntax
- Comments and documentation
🧠 IntelliSense Support
Smart auto-completion for BoxLang development including:
- Built-in function suggestions with over 100 global BoxLang functions
- Keyword completion
- Variable and scope recognition
- Context-aware suggestions
🎭 Custom BoxLang Theme
A beautiful, professionally designed theme featuring BoxLang's signature cyan-blue gradient colors from the official logo, optimized for readability and long coding sessions.
📁 Template Language Support
Seamless editing experience for BoxLang templates with proper highlighting of:
<bx:script>blocks- All BoxLang components like
<bx:if>,<bx:loop>,<bx:output> - String interpolation within templates
- Mixed HTML and BoxLang syntax
Getting Started
Installation is simple with npm:
npm install boxlang-monaco-editor monaco-editor
And getting up and running takes just a few lines of code:
import * as monaco from 'monaco-editor';
import { initializeBoxLangSupport, createBoxLangEditor } from 'boxlang-monaco-editor';
// Initialize BoxLang support
initializeBoxLangSupport();
// Create a BoxLang editor
const editor = createBoxLangEditor(document.getElementById('editor'), {
value: 'class { function init() { return this; } }',
language: 'boxlang',
theme: 'boxlang-theme'
});
Perfect for Modern Development Workflows
This package is ideal for a variety of use cases:
- Online IDEs and Code Playgrounds: Provide BoxLang editing capabilities in browser-based development environments
- Documentation Sites: Create interactive examples and tutorials with proper syntax highlighting
- Learning Platforms: Build educational tools for teaching BoxLang development
- Code Review Tools: Enhance code review interfaces with proper BoxLang syntax support
- Configuration Editors: Build user-friendly interfaces for editing BoxLang configuration files
Get Involved
The boxlang-monaco-editor package is open source and we welcome contributions from the community. Whether you want to:
- Add new language features
- Improve syntax highlighting
- Create additional themes
- Enhance documentation
- Report bugs or suggest improvements
Visit our GitHub repository to get started.
Try It Today
Ready to enhance your BoxLang development experience? Install the package and start building better code editing experiences for your users. With Monaco Editor's proven reliability and our comprehensive BoxLang support, you'll have everything you need to create professional-grade development tools.
npm install boxlang-monaco-editor
The future of BoxLang development just got a whole lot brighter! 🚀
Professional Open Source
BoxLang is a professional open-source product, with three different licences:
- Open-Source Apache2
- BoxLang +
- BoxLang ++
BoxLang is free, open-source software under the Apache 2.0 license. We encourage and support community contributions. BoxLang+ and BoxLang ++ are commercial versions offering support and enterprise features. Our licensing model is based on fairness and the golden rule: Do to others as you want them to do to you. No hidden pricing or pricing on cores, RAM, SaaS, multi-domain or ridiculous ways to get your money. Transparent and fair.
BoxLang is more than just a language; it's a movement.
Join us and redefine development on the JVM Ready to learn more? Explore BoxLang's Features, Documentation, and Community.
Join the BoxLang Community ⚡️
Be part of the movement shaping the future of web development. Stay connected and receive the latest updates on surrounding anything BoxLang
Subscribe to our newsletter for exclusive content.
Follow Us on Social media and don’t miss any news and updates:
Add Your Comment