uiwjs/react-prismjs

React Component for prismjs.

@uiw/react-prismjs

React Component for prismjs. The current document website.

Install

npm i @uiw/react-prismjs

Basic Usage

import React from 'react';
import ReactPrismjs from '@uiw/react-prismjs';
import 'prismjs/components/prism-java';

const JAVAString =`import com.demo.util.MyType;
import com.demo.util.MyInterface;

public enum Enum {
  VAL1, VAL2, VAL3
}

public class Class<T, V> implements MyInterface {
  public static final MyType<T, V> member;
  
  @Override
  public MyType method() {
    return member;
  }

  public void method2(MyType<T, V> value) {
    method();
    value.method3();
    member = value;
  }
}
`;

export default function Demo() {
  return (
    <ReactPrismjs language="java" source={JAVAString} style={{ backgroundColor: '#f6f8fa', fontSize: 16 }} />
  )
}

Theme

Support prismjs theme setting

import ReactPrismjs from '@uiw/react-prismjs';
import 'prismjs/themes/prism-coy.css';

Options Props

interface ReactPrismjsProps {
  prefixCls?: string;
  language?: string;
  source?: string;
  className?: string;
}

• source - string The code string source to parse (required)
• language - string A language id in Prism.languages.
• className - string Class name of the container element.

Development

development

Runs the project in development mode.

# listen to the component compile and output the .js file and listen for compilation output type .d.ts file
npm run watch
# development mode, listen to compile preview website instance
npm run doc:dev

Contributors

As always, thanks to our amazing contributors!

Made with contributors.

License

Licensed under the MIT License.

react-prismjs's Issues

Dependency Dashboard

This issue lists Renovate updates and detected dependencies. Read the Dependency Dashboard docs to learn more.

Other Branches

These updates are pending. To force PRs open, click the checkbox below.

• chore(deps): update actions/checkout action to v4
• chore(deps): update actions/setup-node action to v4
• chore(deps): update peaceiris/actions-gh-pages action to v4

Open

These updates have all been created already. Click a checkbox below to force a retry/rebase of any.

• fix(deps): update react monorepo to ~18.3.0 (react, react-dom)
• chore(deps): update dependency husky to v9
• chore(deps): update dependency lerna to v8
• fix(deps): update dependency @uiw/react-markdown-preview-example to v2
• fix(deps): update dependency @uiw/react-shields to v2
• Click on this checkbox to rebase all open PRs at once

Detected dependencies

github-actions

.github/workflows/ci.yml

• actions/checkout v3
• actions/setup-node v3
• peaceiris/actions-gh-pages v3
• ncipollo/release-action v1

npm

core/package.json

• @types/prismjs ~1.26.0
• prismjs ~1.29.0
• react >=16.8.0
• react-dom >=16.8.0

package.json

• @types/react ^18.2.15
• @types/react-dom ^18.2.7
• @types/react-test-renderer ^18.0.0
• @kkt/ncc ^1.0.15
• compile-less-cli ^1.8.14
• husky ^8.0.3
• prettier ^3.0.0
• lerna ^7.1.4
• tsbb ^4.1.14
• node >=16.0.0

www/package.json

• @uiw/react-markdown-preview-example ^1.5.5
• @uiw/react-shields ^1.1.3
• react ~18.2.0
• react-dom ~18.2.0
• react-router-dom ^6.8.1
• @kkt/scope-plugin-options ^7.5.2
• kkt ^7.5.2
• markdown-react-code-preview-loader ^2.1.5
• react-test-renderer ^18.2.0
• react >=16.8.0
• react-dom >=16.8.0
• node >=16.0.0

---

• Check this box to trigger a request for Renovate to run again on this repository

Action Required: Fix Renovate Configuration

There is an error with this repository's Renovate configuration that needs to be fixed. As a precaution, Renovate will stop PRs until it is resolved.

Error type: Cannot find preset's package (github>whitesource/merge-confidence:beta)