@dan-online/solid-highlight-ts NPM

solid-highlight

Documentation

Example

TBA

Installation

using npm

npm install --save solid-highlight

using yarn

yarn add solid-highlight

Usage

Importing component

import Highlight from "solid-highlight";

Adding styles

Choose the theme for syntax highlighting and add corresponding styles of highlight.js, either as a stylesheet or by importing in your index.tsx file

  <link rel="stylesheet" href="/path/to/styles/theme-name.css">

import "highlight.js/styles/stackoverflow-light.css";

The styles will most likely be in node_modules/highlight.js/styles folder.

Properties

Property	Type	Default	Description
class	string		Custom css classes to be included
language	string (optional)	`''`	Language of code to be highlighted (will be detected automatically by default)
autoDetect	boolean (optional)	`true`	Whether to automatically detect the language of code to be highlighted
ignoreIllegals	boolean (optional)	`true`	Whether to ignore illegal characters in the code to be highlighted

Syntax highlighting of code snippet

Code snippet that requires syntax highlighting should be passed as children to Highlight component in string format.

<Highlight autoDetect={true}> {"function foo() { return 'bar' }"} </Highlight>

<Highlight autoDetect={false} language={"js"}>
  {"function foo() { return 'bar' }"}
</Highlight>

solidjs component solid-component solid highlight.js syntax highlighting highlight code syntax typescript

highlight.js solid-js

@everything-registry/sub-chunk-215 @zalastax/nolb-_dan-@infinitebrahmanuniverse/nolb-_dan-

0.1.12

2 years ago

0.1.11

2 years ago