Gathering detailed insights and metrics for rehype-prism
Gathering detailed insights and metrics for rehype-prism
Installations
npm install rehype-prismDeveloper
Val-istar-Guo
Developer Guide
BETA
Module System
ESM
Min. Node Version
Typescript Support
Yes
Node Version
18.20.4
NPM Version
10.7.0
Statistics
12 Stars
74 Commits
1 Forks
2 Watching
2 Branches
2 Contributors
Updated on 29 Oct 2024
Bundle Size
243.78 kB
Minified
74.44 kB
Minified + Gzipped
Languages
TypeScript (97.12%)
JavaScript (2.06%)
Shell (0.82%)
Total Downloads
Cumulative downloads
Total Downloads
544,503
Last day
10.3%
903
Compared to previous day
Last week
290.6%
16,286
Compared to previous week
Last month
669.2%
126,041
Compared to previous month
Last year
110.6%
299,640
Compared to previous year
Daily Downloads
Weekly Downloads
Monthly Downloads
Yearly Downloads
Peer Dependencies
1
Dev Dependencies
24
Versions
The unified plugin used to highlight code block in html with Prism.
Usage
This package is ESM only. unified >= 10 is needed to use it. If running on the server side, NodeJS needs to be greater than 12
1import { unified } from "unified"; 2import rehype from "rehype"; 3import remarkParse from "remark-parse"; 4import remarkRehype from "remark-rehype"; 5import rehypePrism from "rehype-prism"; 6import rehypeStringify from "rehype-stringify"; 7 8// you have to load css manual 9import "prismjs/themes/prism-coy.css"; 10import "prismjs/plugins/line-numbers/prism-line-numbers.css"; 11 12// load languages manual 13// import 'prismjs/components/prism-{language}' 14import "prismjs/components/prism-go"; 15import "prismjs/components/prism-java"; 16import "prismjs/components/prism-python"; 17 18// parse markdown to html 19unified() 20 .use(remarkParse) 21 .use(remarkRehype) 22 // it should be after rehype 23 .use(rehypePrism, { plugins: ["line-numbers"] }) 24 .use(rehypeStringify) 25 .parse(/* markdown string */); 26// .processSync(/* markdown string */) 27 28// parse code block in html string 29rehype().use(rehypePrism).use(rehypeStringify).parse(/* html string */); 30// .processSync(/* html string */)
Server Side Render
PrismJS will auto highlight all code at pre code after browser document loaded.
Disabled prism autoHighlight before import 'rehype-prism'. there are two way to do this:
-
set the
window.Prism = { manual: true } -
use the attribute
data-manualon the<script>element you used for prism.<script src="prism.js" data-manual></script>
Some plugins will not work. Because it's only work in browser.
Load Plugins
The names to use can be found here.
Plugins Reimplemented By rehype-prism
The table list plugins that cannot running on the server side. Therefor it has been re-implemented by rehype-prism.
| Plugin Name |
|---|
| line-numbers |
| toolbar |
| copy-to-clipboard |
I haven't tested all prism plugins. If there are another plugins not work, submit issue on github.
Load More Languages
- Use babel-plugin-prismjs.
- Use
loadLanguages()provided byprismjs.(don't useloadLanguages()with Webpack or another bundler) - Import language manual. e.g.
import 'prismjs/components/prism-yaml.js'
Load Themes
- If you use babel-plugin-prismjs.
import 'prismjs'will auto load the theme setted in babel-plugin-prismjs config. - Import theme css manual. e.g.
import 'prismjs/themes/prism-coy.css'
See More
shiki is another code highlight tools that support unified. I recommend you try it. It's new, but better suited for modern front-end projects than Prismjs.
This does not mean that I will give up maintaining this library. If you need this library and have any issue, let me know it.
Contributing & Development
If there is any doubt, it is very welcome to discuss the issue together.
No vulnerabilities found.
Reason
no dangerous workflow patterns detected
Reason
no binaries found in the repo
Reason
0 existing vulnerabilities detected
Reason
license file detected
Details
- Info: project has a license file: LICENSE:0
- Info: FSF or OSI recognized license: MIT License: LICENSE:0
Reason
packaging workflow detected
Details
- Info: Project packages its releases by way of GitHub Actions.: .github/workflows/release.yml:10
Reason
5 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 4
Reason
Found 0/30 approved changesets -- score normalized to 0
Reason
dependency not pinned by hash detected -- score normalized to 0
Details
- Warn: third-party GitHubAction not pinned by hash: .github/workflows/auto-assign.yml:19: update your workflow using https://app.stepsecurity.io/secureworkflow/Val-istar-Guo/rehype-prism/auto-assign.yml/master?enable=pin
- Warn: third-party GitHubAction not pinned by hash: .github/workflows/release.yml:13: update your workflow using https://app.stepsecurity.io/secureworkflow/Val-istar-Guo/rehype-prism/release.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/release.yml:19: update your workflow using https://app.stepsecurity.io/secureworkflow/Val-istar-Guo/rehype-prism/release.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/release.yml:21: update your workflow using https://app.stepsecurity.io/secureworkflow/Val-istar-Guo/rehype-prism/release.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/test.yml:7: update your workflow using https://app.stepsecurity.io/secureworkflow/Val-istar-Guo/rehype-prism/test.yml/master?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/test.yml:8: update your workflow using https://app.stepsecurity.io/secureworkflow/Val-istar-Guo/rehype-prism/test.yml/master?enable=pin
- Warn: third-party GitHubAction not pinned by hash: .github/workflows/test.yml:15: update your workflow using https://app.stepsecurity.io/secureworkflow/Val-istar-Guo/rehype-prism/test.yml/master?enable=pin
- Info: 0 out of 4 GitHub-owned GitHubAction dependencies pinned
- Info: 0 out of 3 third-party GitHubAction dependencies pinned
Reason
detected GitHub workflow tokens with excessive permissions
Details
- Warn: no topLevel permission defined: .github/workflows/auto-assign.yml:1
- Warn: no topLevel permission defined: .github/workflows/test.yml:1
- Info: no jobLevel write permissions found
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
security policy file not detected
Details
- Warn: no security policy file detected
- Warn: no security file to analyze
- Warn: no security file to analyze
- Warn: no security file to analyze
Reason
project is not fuzzed
Details
- Warn: no fuzzer integrations found
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
- Warn: 0 commits out of 7 are checked with a SAST tool
Score
4.6
/10
Last Scanned on 2024-11-25
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More