ReadMe's React-based syntax highlighter based on CodeMirror and react-codemirror2
npm install --save @readme/syntax-highlighter
const syntaxHighlighter = require('@readme/syntax-highlighter');
const ele = syntaxHighlighter('console.log("Hello, world!");', 'js');
const syntaxHighlighter = require('@readme/syntax-highlighter');
const ele = syntaxHighlighter('console.log("Hello, world!");', 'js', { ...opts, highlightMode: true });
const syntaxHighlighter = require('@readme/syntax-highlighter');
const ele = syntaxHighlighter('console.log("Hello, world!");', 'js', {
...opts,
highlightMode: true,
ranges: [
[
{ ch: 0, line: 0 },
{ ch: 0, line: 1 },
],
],
});
Access to a full code Mirror instance. See configuration settings in the react-codemirror2
library
const syntaxHighlighter = require('@readme/syntax-highlighter');
const ele = syntaxHighlighter('console.log("Hello, world!");', 'js', { ...opts, editable: true }, { ...editorProps });
Name | Type | Description |
---|---|---|
customTheme |
String | Highlighting theme. One of neo , material-palenight , or tomorrow-night . (Setting this will override the dark mode option.) |
dark |
Boolean | Enable dark mode. |
editable |
Boolean | Enable the full CodeMirror instance |
highlightMode |
Boolean | Enable line number display. |
inline |
String | Wrap code in a <span> tag, instead of a <div> . |
ranges |
Array | Ranges of line numbers to apply highlighting to. Requires highlightMode enabled |
tokenizeVariables |
Boolean | Match and render ReadMe variables in your markdown. |
Language | Available language mode(s) |
---|---|
ASP.NET |
asp , aspx
|
C | c |
C++ |
c++ , cpp , cplusplus
|
C# |
cs , csharp
|
Clojure |
clj , cljc , cljx , clojure
|
CSS |
css , less , sass , scss , styl , stylus
|
cURL | curl |
D | d |
Dart | dart |
Docker | dockerfile |
Erlang |
erl , erlang
|
Go | go |
GraphQL |
gql , graphql
|
Groovy |
gradle , groovy
|
Handlebars |
handlebars , hbs
|
HTML/XML |
html , xhtml , xml
|
HTTP | http |
Java | java |
JavaScript |
coffeescript , ecmascript , javascript , js , jsx , node
|
JSON | json |
Julia |
jl , julia
|
Kotlin |
kotlin , kt
|
Liquid | liquid |
Markdown | markdown |
Objective-C |
objc , objectivec , |
Objective-C++ |
objc++ , objcpp , objectivecpp , objectivecplusplus , |
OCaml |
ocaml , ml
|
Perl |
perl , pl
|
PHP | php |
PowerShell |
powershell , ps1
|
Python |
py , python
|
R | r |
React | jsx |
Ruby |
jruby , macruby , rake , rb , rbx , ruby
|
Rust |
rs , rust
|
Scala | scala |
Shell |
bash , sh , shell , zsh
|
SQL |
cql , mssql , mysql , plsql , postgres , postgresql , pgsql , sql , sqlite
|
Swift | swift |
TOML | toml |
TypeScript |
ts , typescript
|
YAML |
yaml , yml
|