diff --git a/assets/css/_common/components/third-party/index.scss b/assets/css/_common/components/third-party/index.scss index d6b6a2a..51c75b2 100644 --- a/assets/css/_common/components/third-party/index.scss +++ b/assets/css/_common/components/third-party/index.scss @@ -3,7 +3,6 @@ @import 'utterances'; @import 'search'; @import 'related-posts'; -@import 'math'; @import 'gitter'; @import 'livere'; @import 'waline'; diff --git a/assets/css/_common/components/third-party/math.scss b/assets/css/_common/components/third-party/math.scss deleted file mode 100644 index 46883b2..0000000 --- a/assets/css/_common/components/third-party/math.scss +++ /dev/null @@ -1,9 +0,0 @@ -@if $math_mathjax_enable { - mjx-container[jax='CHTML'][display='true'], .has-jax { - overflow: auto hidden; - } - - mjx-container[display='true'] + br { - display: none; - } -} diff --git a/assets/css/main.scss b/assets/css/main.scss index 78c46c2..cfc0739 100644 --- a/assets/css/main.scss +++ b/assets/css/main.scss @@ -112,7 +112,6 @@ $reading_progress_position : {{ $P.readingProgress.position }}; $reading_progress_reversed : {{ $P.readingProgress.reversed }}; // Thirdparty -$math_mathjax_enable : {{ $P.math.mathjax.enable }}; // TODO //$related_posts_enable : {{ $P.relatedPosts.enable }}; $related_posts_enable : false; diff --git a/data/resources.yaml b/data/resources.yaml index d9403f4..97c26fe 100644 --- a/data/resources.yaml +++ b/data/resources.yaml @@ -81,4 +81,25 @@ algolia: instant: name: instantsearch.js version: 4.40.5 - file: dist/instantsearch.production.min.js \ No newline at end of file + file: dist/instantsearch.production.min.js + +plugins: + mathjax: + js: + - name: mathjax + version: 3.2.0 + file: es5/tex-mml-chtml.js + katex: + js: + - name: katex + version: 0.16.0 + file: dist/katex.min.js + - name: auto-render + alias: katex + version: 0.16.0 + file: dist/contrib/auto-render.min.js + css: + - name: katex + version: 0.16.0 + file: dist/katex.min.css + diff --git a/exampleSite/config.yaml b/exampleSite/config.yaml index fa3b7ca..64fb5d0 100644 --- a/exampleSite/config.yaml +++ b/exampleSite/config.yaml @@ -700,27 +700,11 @@ params: # Third Party Plugins & Services Settings # --------------------------------------------------------------- - # TODO - # 数学公式渲染支持（暂时未实现） - # Math Formulas Render Support - # Warning: Please install / uninstall the relevant renderer according to the documentation. - # See: https://theme-next.js.org/docs/third-party-services/math-equations - # Server-side plugin: https://github.com/next-theme/hexo-filter-mathjax - math: - # Default (false) will load mathjax / katex script on demand. - # That is it only render those page which has `mathjax: true` in front-matter. - # If you set it to true, it will load mathjax / katex script EVERY PAGE. - every_page: false - - mathjax: - enable: false - # Available values: none | ams | all - tags: none - - katex: - enable: false - # See: https://github.com/KaTeX/KaTeX/tree/master/contrib/copy-tex - copy_tex: false + # 数学公式渲染支持，可选值： mathjax, katex + # 注意这里全局配置，意味着所有页面都会加载数学公式脚本 + # Math Formulas Render Support, options: mathjax, katex + # Warning: It's global settings then will load scripts in every page. + #math: mathjax # TODO # FancyBox is a tool that offers a nice and elegant way diff --git a/exampleSite/content/post/math-formula.md b/exampleSite/content/post/math-formula.md new file mode 100644 index 0000000..ac0f252 --- /dev/null +++ b/exampleSite/content/post/math-formula.md @@ -0,0 +1,227 @@ +--- +title: "数学公式渲染" +description: "主题支持mathjs和katex两种不同插件的数学公式渲染方案。" +keywords: "math,formula" + +date: 2022-09-11T10:16:02+08:00 +lastmod: 2022-09-11T10:16:02+08:00 + +categories: + - 示例 +tags: + - 数学公式 + - mathjax + - katex + + +url: "post/math-formula.html" +math: mathjax +--- + +本主题支持 `mathjax` 和 `katex` 两种不的方案支持数学公式的渲染，可根据自已的需求进行选择。 + + + +接下的示例中，将使用 [MathJax](https://www.mathjax.org/) 方案来展示渲染效果。 + +{{< note info >}} + +- 使用 `hugo new` 命令创建一篇新的文章 +- 可以全局启用数据公式渲染，请在项目配置参数 `math: katex` 或 `math: mathjax` +- 或是将该参数配置到需要显示数学公式的页面头部（减少不必要的加载消耗） + +{{< /note >}} + +**注意：** 使用[支持的TeX功能](https://docs.mathjax.org/en/latest/input/tex/index.html)的联机参考资料。 + +### 例子 + + +## 重复的分数 +$$ +\frac{1}{\Bigl(\sqrt{\phi \sqrt{5}}-\phi\Bigr) e^{\frac25 \pi}} \equiv 1+\frac{e^{-2\pi}} {1+\frac{e^{-4\pi}} {1+\frac{e^{-6\pi}} {1+\frac{e^{-8\pi}} {1+\cdots} } } } +$$ + + +## 总和记号 +$$ +\left( \sum_{k=1}^n a_k b_k \right)^2 \leq \left( \sum_{k=1}^n a_k^2 \right) \left( \sum_{k=1}^n b_k^2 \right) +$$ + + +## 几何级数之和 +我把接下来的两个例子分成了几行，这样它在手机上表现得更好。这就是为什么它们包含 `\displaystyle`。 + +$$ +\displaystyle\sum_{i=1}^{k+1}i +$$ + +$$ +\displaystyle= \left(\sum_{i=1}^{k}i\right) +(k+1) +$$ + +$$ +\displaystyle= \frac{k(k+1)}{2}+k+1 +$$ + +$$ +\displaystyle= \frac{k(k+1)+2(k+1)}{2} +$$ + +$$ +\displaystyle= \frac{(k+1)(k+2)}{2} +$$ + +$$ +\displaystyle= \frac{(k+1)((k+1)+1)}{2} +$$ + +## 乘记号 +$$ +\displaystyle 1 + \frac{q^2}{(1-q)}+\frac{q^6}{(1-q)(1-q^2)}+\cdots = \displaystyle \prod_{j=0}^{\infty}\frac{1}{(1-q^{5j+2})(1-q^{5j+3})}, \displaystyle\text{ for }\lvert q\rvert < 1. +$$ + + +## 随文数式 +这是一些线性数学: $$ k_{n+1} = n^2 + k_n^2 - k_{n-1} $$ ， 然后是更多的文本。 + + +## 希腊字母 +$$ +\Gamma\ \Delta\ \Theta\ \Lambda\ \Xi\ \Pi\ \Sigma\ \Upsilon\ \Phi\ \Psi\ \Omega +\alpha\ \beta\ \gamma\ \delta\ \epsilon\ \zeta\ \eta\ \theta\ \iota\ \kappa\ \lambda\ \mu\ \nu\ \xi \ \omicron\ \pi\ \rho\ \sigma\ \tau\ \upsilon\ \phi\ \chi\ \psi\ \omega\ \varepsilon\ \vartheta\ \varpi\ \varrho\ \varsigma\ \varphi +$$ + + +## 箭头 +$$ +\gets\ \to\ \leftarrow\ \rightarrow\ \uparrow\ \Uparrow\ \downarrow\ \Downarrow\ \updownarrow\ \Updownarrow +$$ + +$$ +\Leftarrow\ \Rightarrow\ \leftrightarrow\ \Leftrightarrow\ \mapsto\ \hookleftarrow +\leftharpoonup\ \leftharpoondown\ \rightleftharpoons\ \longleftarrow\ \Longleftarrow\ \longrightarrow +$$ + +$$ +\Longrightarrow\ \longleftrightarrow\ \Longleftrightarrow\ \longmapsto\ \hookrightarrow\ \rightharpoonup +$$ + +$$ +\rightharpoondown\ \leadsto\ \nearrow\ \searrow\ \swarrow\ \nwarrow +$$ + + +## 符号 +$$ +\surd\ \barwedge\ \veebar\ \odot\ \oplus\ \otimes\ \oslash\ \circledcirc\ \boxdot\ \bigtriangleup +$$ + +$$ +\bigtriangledown\ \dagger\ \diamond\ \star\ \triangleleft\ \triangleright\ \angle\ \infty\ \prime\ \triangle +$$ + + +## 微积分学 +$$ +\int u \frac{dv}{dx}\,dx=uv-\int \frac{du}{dx}v\,dx +$$ + +$$ +f(x) = \int_{-\infty}^\infty \hat f(\xi)\,e^{2 \pi i \xi x} +$$ + +$$ +\oint \vec{F} \cdot d\vec{s}=0 +$$ + + +## 洛伦茨方程 +$$ +\begin{aligned} \dot{x} & = \sigma(y-x) \\\\ \dot{y} & = \rho x - y - xz \\\\ \dot{z} & = -\beta z + xy \end{aligned} +$$ + + +## 交叉乘积 +这在KaTeX中是可行的，但在这种环境中馏分的分离不是很好。 + +$$ +\mathbf{V}_1 \times \mathbf{V}_2 = \begin{vmatrix} \mathbf{i} & \mathbf{j} & \mathbf{k} \\\\ \frac{\partial X}{\partial u} & \frac{\partial Y}{\partial u} & 0 \\\\ \frac{\partial X}{\partial v} & \frac{\partial Y}{\partial v} & 0 \end{vmatrix} +$$ + +这里有一个解决方案:使用“mfrac”类(在MathJax情况下没有区别)的额外类使分数更小: + +$$ +\mathbf{V}_1 \times \mathbf{V}_2 = \begin{vmatrix} \mathbf{i} & \mathbf{j} & \mathbf{k} \\\\ \frac{\partial X}{\partial u} & \frac{\partial Y}{\partial u} & 0 \\\\ \frac{\partial X}{\partial v} & \frac{\partial Y}{\partial v} & 0 \end{vmatrix} +$$ + + +## 强调 +$$ +\hat{x}\ \vec{x}\ \ddot{x} +$$ + + +## 有弹性的括号 +$$ +\left(\frac{x^2}{y^3}\right) +$$ + + +## 评估范围 +$$ +\left.\frac{x^3}{3}\right|_0^1 +$$ + + +## 诊断标准 +$$ +f(n) = \begin{cases} \frac{n}{2}, & \text{if } n\text{ is even} \\\\ 3n+1, & \text{if } n\text{ is odd} \end{cases} +$$ + + +## 麦克斯韦方程组 +$$ +\begin{aligned} \nabla \times \vec{\mathbf{B}} -\, \frac1c\, \frac{\partial\vec{\mathbf{E}}}{\partial t} & = \frac{4\pi}{c}\vec{\mathbf{j}} \\\\ \nabla \cdot \vec{\mathbf{E}} & = 4 \pi \rho \\\\ \nabla \times \vec{\mathbf{E}}\, +\, \frac1c\, \frac{\partial\vec{\mathbf{B}}}{\partial t} & = \vec{\mathbf{0}} \\\\ \nabla \cdot \vec{\mathbf{B}} & = 0 \end{aligned} +$$ + + +## 统计学 +固定词组： + +$$ +\frac{n!}{k!(n-k)!} = {^n}C_k +{n \choose k} +$$ + +## 分数在分数 +$$ +\frac{\frac{1}{x}+\frac{1}{y}}{y-z} +$$ + + +## ｎ次方根 +$$ +\sqrt[n]{1+x+x^2+x^3+\ldots} +$$ + + +## 矩阵 +$$ +\begin{pmatrix} a_{11} & a_{12} & a_{13}\\\\ a_{21} & a_{22} & a_{23}\\\\ a_{31} & a_{32} & a_{33} \end{pmatrix} +\begin{bmatrix} 0 & \cdots & 0 \\\\ \vdots & \ddots & \vdots \\\\ 0 & \cdots & 0 \end{bmatrix} +$$ + + +## 标点符号 +$$ +f(x) = \sqrt{1+x} \quad (x \ge -1) +f(x) \sim x^2 \quad (x\to\infty) +$$ + +现在用标点符号: + +$$ +f(x) = \sqrt{1+x}, \quad x \ge -1 +f(x) \sim x^2, \quad x\to\infty +$$ \ No newline at end of file diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html index 9c7c917..7606f8a 100644 --- a/layouts/_default/baseof.html +++ b/layouts/_default/baseof.html @@ -40,7 +40,7 @@ - {{- partialCached "scripts.html" . }} + {{- partial "scripts.html" . }} \ No newline at end of file diff --git a/layouts/partials/_funs/get_res.html b/layouts/partials/_funs/get_res.html new file mode 100644 index 0000000..6aa8a7f --- /dev/null +++ b/layouts/partials/_funs/get_res.html @@ -0,0 +1,16 @@ +{{/* Use to get resources path with vendor */}} + +{{ $fmt := "%s/%s@%s/%s" }} + +{{ $npm := .res.name }} +{{ with .res.alias }} + {{ $npm = . }} +{{ end }} +{{ $file := .res.file }} +{{ if eq .vendor "cdnjs" }} + {{ $file = replaceRE `(dist|lib|source\/js)\/` "" .res.file }} + {{ $fmt = "%s/%s/%s/%s" }} +{{ end }} +{{ $pluginRes := printf $fmt .router $npm .res.version $file }} + +{{ return $pluginRes }} \ No newline at end of file diff --git a/layouts/partials/scripts.html b/layouts/partials/scripts.html index 4015bd1..269db66 100644 --- a/layouts/partials/scripts.html +++ b/layouts/partials/scripts.html @@ -1,80 +1,39 @@ - -{{- $jsRes := .Site.Data.resources.js }} +{{ partialCached "scripts/global.html" . }} + {{- $vendor := .Site.Params.vendors.plugins }} {{- $router := .Scratch.Get "router" }} -{{ $jsFmt := "%s/%s@%s/%s" }} -{{- range $js := $jsRes }} - {{- $npm := $js.name }} - {{- $file := $js.file }} - {{- if eq $vendor "cdnjs" }} - {{- with $js.alias }} - {{- $npm = . }} - {{- end }} - {{- $file = replaceRE `(dist|lib|source\/js)\/` "" $js.file }} - {{- $jsFmt = "%s/%s/%s/%s" }} - {{- end }} - {{- $pluginJS := printf $jsFmt $router $npm $js.version $file }} - -{{- end }} - + +{{ $math := .Params.math | default .Site.Params.math }} +{{ if $math }} + {{- partialCached "scripts/plugins.html" (dict "vendor" $vendor "router" $router "res" .Site.Data.resources.plugins "index" $math) }} + {{ if eq $math "katex" }} + + {{ end }} + {{ if eq $math "mathjax" }} + + {{ end }} +{{ end }} + + -{{- $config := resources.Get "js/config.js" }} -{{- $motion := resources.Get "js/motion.js" }} -{{- $boot := resources.Get "js/next-boot.js" }} -{{- $utils := resources.Get "js/utils.js" }} -{{- $nextjs := (slice $config $utils $boot ) }} -{{- if .Site.Params.motion.enable }} -{{ $motionjs := resources.Get "js/motion.js" }} -{{ $nextjs = $nextjs | append $motionjs }} -{{- end }} -{{- if or (eq .Site.Params.shceme "Muse") (eq .Site.Params.shceme "Mist") }} -{{ $musejs := resources.Get "js/schemes/muse.js" }} -{{ $nextjs = $nextjs | append $musejs }} -{{- end }} -{{- if .Site.Params.bookmark.enable }} -{{- $bookmarkjs := resources.Get "js/bookmark.js" }} -{{- $nextjs = $nextjs | append $bookmarkjs }} -{{- end }} -{{- if .Site.Params.pjax }} -{{- $pjaxjs := resources.Get "js/pjax.js" }} -{{- $nextjs = $nextjs | append $pjaxjs }} -{{- end }} -{{- if isset .Site.Params "addthisid" }} -{{- $addthisjs := resources.Get "js/third-party/share/addthis.js" }} -{{- $nextjs = $nextjs | append $addthisjs }} -{{- end }} -{{- if isset .Site.Params "waline" }} -{{- $walinejs := resources.Get "js/third-party/comments/waline.js" }} -{{- $nextjs = $nextjs | append $walinejs }} -{{- end }} -{{- if isset .Site.Params "giscus" }} -{{- $giscusjs := resources.Get "js/third-party/comments/giscus.js" }} -{{- $nextjs = $nextjs | append $giscusjs }} -{{- end }} -{{- if isset .Site.Params "livere" }} -{{- $liverejs := resources.Get "js/third-party/comments/livere.js" }} -{{- $nextjs = $nextjs | append $liverejs }} -{{- end }} -{{- if isset .Site.Params "artalk" }} -{{- $artalkjs := resources.Get "js/third-party/comments/artalk.js" }} -{{- $nextjs = $nextjs | append $artalkjs }} -{{- end }} -{{- if isset .Site.Params "utterances" }} -{{- $utterancesjs := resources.Get "js/third-party/comments/utterances.js" }} -{{- $nextjs = $nextjs | append $utterancesjs }} -{{- end }} -{{- if .Site.Params.localSearch.enable }} -{{- $search := resources.Get "js/third-party/search/local.js" }} -{{- $nextjs = $nextjs | append $search }} -{{ end }} -{{- if .Site.Params.algoliaSearch.enable }} -{{- $search := resources.Get "js/third-party/search/algolia.js" }} -{{- $nextjs = $nextjs | append $search }} -{{ end }} -{{- $nextjs = $nextjs | resources.Concat "js/main.js"}} -{{ if hugo.IsProduction }} -{{- $nextjs = $nextjs | minify | fingerprint }} -{{ end }} - diff --git a/layouts/partials/scripts/global.html b/layouts/partials/scripts/global.html new file mode 100644 index 0000000..d48cc4f --- /dev/null +++ b/layouts/partials/scripts/global.html @@ -0,0 +1,68 @@ +{{- $jsRes := .Site.Data.resources.js }} +{{- $vendor := .Site.Params.vendors.plugins }} +{{- $router := .Scratch.Get "router" }} +{{- range $jsRes }} + {{ $pluginJS := partial "_funs/get_res.html" (dict "res" . "vendor" $vendor "router" $router) }} + +{{- end }} + + + +{{- $config := resources.Get "js/config.js" }} +{{- $motion := resources.Get "js/motion.js" }} +{{- $boot := resources.Get "js/next-boot.js" }} +{{- $utils := resources.Get "js/utils.js" }} +{{- $nextjs := (slice $config $utils $boot ) }} +{{- if .Site.Params.motion.enable }} +{{ $motionjs := resources.Get "js/motion.js" }} +{{ $nextjs = $nextjs | append $motionjs }} +{{- end }} +{{- if or (eq .Site.Params.shceme "Muse") (eq .Site.Params.shceme "Mist") }} +{{ $musejs := resources.Get "js/schemes/muse.js" }} +{{ $nextjs = $nextjs | append $musejs }} +{{- end }} +{{- if .Site.Params.bookmark.enable }} +{{- $bookmarkjs := resources.Get "js/bookmark.js" }} +{{- $nextjs = $nextjs | append $bookmarkjs }} +{{- end }} +{{- if .Site.Params.pjax }} +{{- $pjaxjs := resources.Get "js/pjax.js" }} +{{- $nextjs = $nextjs | append $pjaxjs }} +{{- end }} +{{- if isset .Site.Params "addthisid" }} +{{- $addthisjs := resources.Get "js/third-party/share/addthis.js" }} +{{- $nextjs = $nextjs | append $addthisjs }} +{{- end }} +{{- if isset .Site.Params "waline" }} +{{- $walinejs := resources.Get "js/third-party/comments/waline.js" }} +{{- $nextjs = $nextjs | append $walinejs }} +{{- end }} +{{- if isset .Site.Params "giscus" }} +{{- $giscusjs := resources.Get "js/third-party/comments/giscus.js" }} +{{- $nextjs = $nextjs | append $giscusjs }} +{{- end }} +{{- if isset .Site.Params "livere" }} +{{- $liverejs := resources.Get "js/third-party/comments/livere.js" }} +{{- $nextjs = $nextjs | append $liverejs }} +{{- end }} +{{- if isset .Site.Params "artalk" }} +{{- $artalkjs := resources.Get "js/third-party/comments/artalk.js" }} +{{- $nextjs = $nextjs | append $artalkjs }} +{{- end }} +{{- if isset .Site.Params "utterances" }} +{{- $utterancesjs := resources.Get "js/third-party/comments/utterances.js" }} +{{- $nextjs = $nextjs | append $utterancesjs }} +{{- end }} +{{- if .Site.Params.localSearch.enable }} +{{- $search := resources.Get "js/third-party/search/local.js" }} +{{- $nextjs = $nextjs | append $search }} +{{ end }} +{{- if .Site.Params.algoliaSearch.enable }} +{{- $search := resources.Get "js/third-party/search/algolia.js" }} +{{- $nextjs = $nextjs | append $search }} +{{ end }} +{{- $nextjs = $nextjs | resources.Concat "js/main.js"}} +{{ if hugo.IsProduction }} +{{- $nextjs = $nextjs | minify | fingerprint }} +{{ end }} + \ No newline at end of file diff --git a/layouts/partials/scripts/plugins.html b/layouts/partials/scripts/plugins.html new file mode 100644 index 0000000..49cce10 --- /dev/null +++ b/layouts/partials/scripts/plugins.html @@ -0,0 +1,17 @@ + +{{- $vendor := .vendor }} +{{- $router := .router }} +{{- $res := (index .res .index) }} +{{- $cssRes := $res.css }} +{{ if $cssRes }} + {{ range $cssRes }} + {{ $css := partial "_funs/get_res.html" (dict "res" . "vendor" $vendor "router" $router) }} + + {{ end }} +{{ end }} +{{- $jsRes := $res.js }} +{{ range $jsRes }} + {{ $js := partial "_funs/get_res.html" (dict "res" . "vendor" $vendor "router" $router) }} + +{{ end }} +