codemirror-jsx

JSX support for CodeMirror.

Installation via NPM

npm install codemirror-jsx --save

Installation via JSPM

jspm install npm:codemirror -o '{format: "amd"}'
jspm install npm:codemirror-jsx

Usage

You can simply either define the mode by importing codemirror-jsx, or you can support JSX syntax for all JS files by doing the following (recommended):

import CodeMirror from 'codemirror';
import CodeMirrorModeMeta from 'codemirror/mode/meta.js';
import CodeMirrorLoadMode from 'codemirror/addon/mode/loadmode.js';
import 'codemirror-jsx/replace-js';

// and then later on when loading the mode...
const someFilename = 'some-module.js';
const extension = someFilename.split('.').pop();
const mode = CodeMirror.findModeByExtension(extension);
const element = document.getElementById('code-mirror');
const editor = CodeMirror(element, { mode });

if (mode && mode.mode) {
  editor.setOption('mode', mode.mode);
  CodeMirror.autoLoadMode(editor, mode.mode);
}