@maji/react-prism

A React component for highlighting code with Prism

Stats

StarsIssuesVersionUpdatedCreatedSize
@maji/react-prism
701.0.14 years ago4 years agoMinified + gzip package size for @maji/react-prism in KB

Readme

@maji/react-prism

A React component for highlighting code with Prism.

Installation

This component does not bundle Prism; you have to include it in your project. To install both Prism and this component, run:

$ yarn add prismjs @maji/react-prism

Example

A simple example of highlighting some javascript:

import Prism from '@maji/react-prism'

const App = (
  <div className='app'>
    <Prism language='javascript'>
      {`
        // your code goes here...
        var foo = 'bar'
      `}
    </Prism>
  </div>
)

A more complete example is in example/app.js.

NOTE: you will also need to include Prism's CSS. When installed with npm, its stylesheets are at node_modules/prismjs/themes/*.css.

NOTE x 2: to support languages other than JavaScript, you'll have to manually import the language from Prism. For example, to add Bash support, do import 'prismjs/components/prism-bash'.

License

MIT

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.