Skip to content

Commit 0d5c296

Browse files
committed
Adding Language Modes documentation, closesJedWatson#15
1 parent 99abf8f commit 0d5c296

File tree

1 file changed

+26
-3
lines changed

1 file changed

+26
-3
lines changed

‎README.md‎

Lines changed: 26 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -31,8 +31,8 @@ npm install react-codemirror --save
3131
## Usage
3232

3333
```
34-
var React = require('react'),
35-
Codemirror = require('react-codemirror');
34+
var React = require('react');
35+
var Codemirror = require('react-codemirror');
3636
3737
var App = React.createClass({
3838
getInitialState: function(){
@@ -65,7 +65,30 @@ React.render(<App />, document.getElementById('app'));
6565

6666
See the [CodeMirror API Docs](https://codemirror.net/doc/manual.html#api) for the available options.
6767

68+
### Using Language Modes
69+
70+
Several [language modes](https://codemirror.net/mode/) are included with CodeMirror for syntax hilighting.
71+
72+
By default (to optimise bundle size) all modes are not included. To enable syntax hilighting:
73+
74+
* install the `codemirror` package dependency (in addition to `react-codemirror`)
75+
* require the language modes you wish to make available _after_ you require `react-codemirror` itself
76+
* set the `mode` option in the `options` object
77+
78+
```js
79+
var React =require('react');
80+
var Codemirror =require('react-codemirror');
81+
require('codemirror/mode/javascript/javascript');
82+
require('codemirror/mode/xml/xml');
83+
require('codemirror/mode/markdown/markdown');
84+
85+
<Codemirror ... options={{
86+
mode:'javascript'
87+
}} />
88+
```
89+
90+
See the [example source](https://github.com/JedWatson/react-codemirror/blob/master/example/src/example.js) for a reference implementation including JavaScript and markdown syntax hilighting.
91+
6892
### License
6993

7094
MIT. Copyright (c) 2015 Jed Watson.
71-

0 commit comments

Comments
(0)