Add prism highlight support (#23)

This commit is contained in:
Mimi 2020-06-13 18:39:55 +08:00 committed by GitHub
parent da9c1dda7c
commit 2446a19039
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
6 changed files with 44 additions and 10 deletions

View File

@ -349,6 +349,10 @@ codeblock:
theme:
light: default
dark: tomorrow-night
# See: https://github.com/PrismJS/prism/tree/master/themes
prism:
light: prism
dark: prism-dark
# Add copy button on codeblock
copy_button:
enable: false
@ -883,6 +887,14 @@ vendors:
# fontawesome: //cdnjs.cloudflare.com/ajax/libs/font-awesome/5.13.0/css/all.min.css
fontawesome:
# Prism
# prism: //cdn.jsdelivr.net/npm/prismjs@1/components/prism-core.min.js
# prism_autoloader: //cdn.jsdelivr.net/npm/prismjs@1/plugins/autoloader/prism-autoloader.min.js
# prism_line_numbers: //cdn.jsdelivr.net/npm/prismjs@1/plugins/line-numbers/prism-line-numbers.js
prism:
prism_autoloader:
prism_line_numbers:
# MathJax
# mathjax: //cdn.jsdelivr.net/npm/mathjax@3/es5/tex-mml-chtml.js
mathjax:

View File

@ -22,11 +22,19 @@ function parse(file) {
}
module.exports = hexo => {
hexo.config.highlight.hljs = false;
let light = `${hexo.plugin_dir}highlight.js/styles/${hexo.theme.config.codeblock.theme.light}.css`;
let dark = `${hexo.plugin_dir}highlight.js/styles/${hexo.theme.config.codeblock.theme.dark}.css`;
hexo.theme.config.highlight = {
light: parse(light),
dark : parse(dark)
let { config } = hexo;
let theme = hexo.theme.config;
config.highlight.hljs = false;
config.prismjs = config.prismjs || {};
theme.highlight = {
enable: config.highlight.enable && !config.prismjs.enable,
light : parse(`${hexo.plugin_dir}highlight.js/styles/${theme.codeblock.theme.light}.css`),
dark : parse(`${hexo.plugin_dir}highlight.js/styles/${theme.codeblock.theme.dark}.css`)
};
theme.prism = {
enable: config.prismjs.enable,
light : `${hexo.plugin_dir}prismjs/themes/${theme.codeblock.prism.light}.css`,
dark : `${hexo.plugin_dir}prismjs/themes/${theme.codeblock.prism.dark}.css`,
number: `${hexo.plugin_dir}prismjs/plugins/line-numbers/prism-line-numbers.css`
};
};

View File

@ -33,7 +33,8 @@ hexo.extend.helper.register('next_config', function() {
labels : theme.algolia_search.labels
},
localsearch: theme.local_search,
motion : theme.motion
motion : theme.motion,
prism : config.prismjs.enable && !config.prismjs.preprocess
};
if (config.search) {
exportConfig.path = config.search.path;

View File

@ -3,10 +3,17 @@
'use strict';
hexo.extend.helper.register('js_vendors', function() {
let { theme } = this;
let { config, theme } = this;
let vendors = {
anime: 'anime.min.js'
};
if (config.prismjs.enable && !config.prismjs.preprocess) {
vendors.prism = '//cdn.jsdelivr.net/npm/prismjs@1/components/prism-core.min.js';
vendors.prism_autoloader = '//cdn.jsdelivr.net/npm/prismjs@1/plugins/autoloader/prism-autoloader.min.js';
if (config.prismjs.line_number) {
vendors.prism_line_numbers = '//cdn.jsdelivr.net/npm/prismjs@1/plugins/line-numbers/prism-line-numbers.js';
}
}
if (theme.pjax) {
vendors.pjax = 'pjax/pjax.min.js';
}

View File

@ -1,8 +1,13 @@
@import hexo-config('highlight.light.file');
@import hexo-config('highlight.light.file') if (hexo-config('highlight.enable'));
if (hexo-config('prism.enable')) {
@import hexo-config('prism.light');
@import hexo-config('prism.number');
}
if (hexo-config('darkmode')) {
@media (prefers-color-scheme: dark) {
@import hexo-config('highlight.dark.file');
@import hexo-config('highlight.dark.file') if (hexo-config('highlight.enable'));
@import hexo-config('prism.dark') if (hexo-config('prism.enable'));
}
}

View File

@ -79,6 +79,7 @@ NexT.boot.refresh = function() {
* Register JS handlers by condition option.
* Need to add config option in Front-End at 'layout/_partials/head.njk' file.
*/
CONFIG.prism && window.Prism.highlightAll();
CONFIG.fancybox && NexT.utils.wrapImageWithFancyBox();
CONFIG.mediumzoom && window.mediumZoom('.post-body :not(a) > img, .post-body > img', {
background: 'var(--content-bg-color)'