react-prism

React.js + Prism.js syntax highlight component

Installation

npm i --save react-prism

Demo

Static hosted demo site on GitHub.

Example

Please refer to the client folder for an example.

Usage

This module is intended to be bundled with webpack/browserify.

First, you have to include prismjs in your index.html:

<script src="path/to/your/prism.js"></script>

Why not require Prism by CommonJS? It's because prism.js will try to run itself as a Web Worker. It won't take affect if we require it into the source.

Then:

import {PrismCode} from "react-prism";

  // In a react component:
  render () {
    return (
      <PrismCode className="language-javascript">
        {require("raw-loader!./PrismCode")}
      </PrismCode>
    );
  }

Development

git clone ...
npm install
cd examples/gh-pages
npm install
npm start

Then open http://localhost:8080.

Contributing

1. Fork it
2. Create your feature branch (git checkout -b my-new-feature)
3. Commit your changes (git commit -am 'Add some feature')
4. Push to the branch (git push origin my-new-feature)
5. Create new pull request

Credits

• prismjs