https://github.com/ele828/hexo-prism-plugin
Hexo plugin for code highlighting by prism.js, supporting JSX syntax
https://github.com/ele828/hexo-prism-plugin
hexo highlight plugin prism
Last synced: 4 months ago
JSON representation
Hexo plugin for code highlighting by prism.js, supporting JSX syntax
- Host: GitHub
- URL: https://github.com/ele828/hexo-prism-plugin
- Owner: ele828
- Created: 2016-07-10T11:48:39.000Z (almost 9 years ago)
- Default Branch: master
- Last Pushed: 2022-01-18T07:12:12.000Z (over 3 years ago)
- Last Synced: 2024-12-19T03:08:16.032Z (4 months ago)
- Topics: hexo, highlight, plugin, prism
- Language: JavaScript
- Homepage:
- Size: 132 KB
- Stars: 205
- Watchers: 4
- Forks: 51
- Open Issues: 22
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
- awesome - ele828/hexo-prism-plugin - Hexo plugin for code highlighting by prism.js, supporting JSX syntax (JavaScript)
- awesome - ele828/hexo-prism-plugin - Hexo plugin for code highlighting by prism.js, supporting JSX syntax (JavaScript)
README
# Hexo-Prism-Plugin [](https://www.npmjs.com/package/hexo-prism-plugin)
Since `highlight.js` didn't support JSX syntax properly, I wrote this plugin to replace
Hexo's default code highlight plugin.
## Install
```
npm i -S hexo-prism-plugin
```
## Usage
Firstly, you should edit your `_config.yml` by adding following configuration.
```yaml
prism_plugin:
mode: 'preprocess' # realtime/preprocess
theme: 'default'
line_number: false # default false
custom_css: 'path/to/your/custom.css' # optional
```
After that, check `highlight` option in `_config.yml`. Make sure that default code highlight plugin is disabled.
```yaml
highlight:
enable: false
```
Finally, clean and re-generate your project by running following commands:
```
hexo clean
```
```
hexo generate
```
## Options
- mode:
- realtime (Parse code on browser in real time)
- preprocess (Preprocess code in node)
- theme:
- default
- coy
- dark
- funky
- okaidia
- solarizedlight
- tomorrow
- twilight
- atom-dark
- base16-ateliersulphurpool.light
- cb
- duotone-dark
- duotone-earth
- duotone-forest
- duotone-light
- duotone-sea
- duotone-space
- ghcolors
- hopscotch
- pojoaque
- vs
- xonokai
- line_number:
- true (Show line numbers)
- false (Default, Hide line numbers)
- no_assets
- true (Stop loading asset files)
- false (Default, load script and stylesheets files)
## Themes
You can check out prism-themes project for additional theme preview:
https://github.com/PrismJS/prism-themes#available-themes
## Supported languages
You could find the supported languages here:
http://prismjs.com/#languages-list
## License
MIT