React-perfect-syntax-highlighter NPM

react-perfect-syntax-highlighter

🌈 Perfect syntax highlighter for React using server components.

Installation

npm install react-perfect-syntax-highlighter

Usage

import { CodeBlock } from "react-perfect-syntax-highlighter";

export default function Page() {
  return (
    <CodeBlock lang="tsx" theme="dracula-soft" code="const meaning = 40 + 2;" />
  );
}

API

`CodeBlock`

A react component that will render a code block with syntax highlighting using the given language and theme.

Props

Name	Type	Description
`code`	`string`	The code to highlight.
`theme`	`string`	The theme to use. See Themes.
`lang`	`string`	The language to use. See Languages.
`className`	`string` (optional)	A class to apply to the code block.