JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 4065
  • Score
    100M100P100Q116524F
  • License MIT

React.js + prismjs syntax hightlight component

Package Exports

  • react-prism

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-prism) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

react-prism

React.js + Prism.js syntax highlight component

Version Travis CI Quality Coverage Dependencies Gitter

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

devDependency Status

  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