Skip to content

vanillawc/wc-codemirror

Repository files navigation

GitHub release npm downloads Known Vulnerabilities MIT licensed Actions Status

A Vanilla Web Component to embed a CodeMirror editor into a web page


Installation

npm i @vanillawc/wc-codemirror

Then import the index.js file at the root of the package.


Usage

<wc-codemirror src="sample.js"></wc-codemirror>

Attributes

  • src - load an external source file
  • style - CSS styling (default height:100%;width:100%;)

Note: The ID attribute is required if there are multiple editors

Properties

  • value - get/set the editor's contents

Basic Usage

<wc-codemirror src="./assets/sample.js"></wc-codemirror>

Demo: WC-CodeMirror - Basic Usage

Syntax Highlighting

<wc-codemirror mode="javascript" src="./assets/sample.js"></wc-codemirror>

Demo: WC-CodeMirror - 'mode' Attribute

Demos

The demo can also be run locally with

npm run start