Typora 中使用

市面上的Markdown编辑器很多,没有办法一一列举。这里仅以 Typora 编辑器为例,其它编辑器可以参考此安装过程。也可以直接使用本人开发的 MK易 全平台软件,省却很多麻烦。

Typora 编辑器 windows 版

Windows 版本的 Typora 需要修改 window.html 文件,其路径一般为:

c:\programm file(86)\Typora\resource\app\window.html

Typora 编辑器 Mac 版

而在 Mac 系统下通过访达窗口只能找到 Typora.app 这一个文件,通过鼠标右键弹出菜单,选择 显示包内容就能显示里面实际的文件。需要修改的是 Contents\Resources\TypeMark\index.html 文件。

Typora 编辑器默认使用 MathJax 渲染,为例避免过多的改动,我提供的方案也使用 MathJax 渲染。但除开Typora, 下面介绍的所有方案,都默认使用 Katex 。

使用在线脚本文件

用任何一款文件或者代码编辑器,打开上述html文件,找到引用MathJax.js脚本文件那一行,

<script src="xxxxxxx/MathJax/MathJax.js"></script>

在其下面添加一行代码:

<script src="https://raw.githack.com/maiernte/img/master/libs/bundle.js?华鹤=1&字体=5&水土=1&短名=0&katex=0"></script>

如果国内的用户访问github服务器有困难,可以使用放在阿里云上的文件

<script src="http://huaheapp.oss-cn-hangzhou.aliyuncs.com/huahelibs/bundle.js?华鹤=1&字体=5&水土=1&短名=0&katex=0"></script>
可能出现的问题:
  1. Typora 编辑器中的数学渲染功能没有打开。请到「偏好设置」~「Markdown」~「内联公式」中设置。
  2. 如果依然无效,可能是由于网络的原因,MathJax库和本人的易学库在加载过程中顺序颠倒了。通过多加一行代码来避免这个问题:
<!-- 在加载 MathJax 库的中间多加一行,保证MathJax加载完成后,调用易学函数库 -->
<script type="text/javascript"
        src="../<pathTOmathjax>/MathJax.js?config=TeX-MML-AM_CHTML">
    window.mathjaxHuahe()
</script>
使用本地脚本文件

因为使用在线脚本文件需要有网络,而希望在无网络环境下也能同样使用的话,需要把脚本文件下载到本地硬盘。

下载上述链接中的zip文件,解压后放到任何一个地方(以放到 Typora 的安装目录下为例

例如:在Typora 安装目录下建立一个新的文件夹 huahelibs,并将压缩包中的所有文件和子目录都拷贝到此目录下,然后依旧添加两行代码。

<script src="./huahelibs/bundle.js?华鹤=1&字体=5&水土=1&短名=1&katex=0"></script>

我会不定期纠正和扩展现有的函数库,所以除非很有必要,建议尽量使用在线脚本。以随时获得最新的功能。

VSCode 中使用

VSCode没有官方指定的 Markdown 渲染器,这里仅以我使用的插件为例。首先安装两个扩展:markdownlint 以及 Markdown Math 。第一个是用来预览时渲染Markdown文件的,第二个是解释数学公式的。地址分别为:markdownlintMardown Math

但 Markdown Math 使用的 Katex 库版本比较老旧,在解释我的函数输出时会有错误。因此需要下载我的数据包。建立一个临时目录,用终端打开,然后执行命令:

npm i huaheyixue

执行完之后会看到一个目录 node_modules 下面有两个子目录:huaheyixue 和 katex。需要将这两个目录拷贝到 Markdown Math 扩展的相应地方(node_modules 目录),替代原来的 Katex 就好。

Windows 中 Markdown Math 的安装目录为

C:\Users\ 你的用户名\.vscode\extensions\koehlma.markdown-math-0.1.0

Mac 中为 ~/.vscode/koehlma.markdown-math-0.1.0,如果找不到,是因为没有显示隐藏目录。将Mac中隐藏的属性打开就好。

­接着修改一下脚本文件: node_modules / markdown-it-katex / index.js

在文件的开头引用华鹤易学函数包

const { globalSetting, DictYiXue} = require('huaheyixue')
function yixue(math){
    var pattern = /(?<express>\\[a-zA-Z0-9]+)\{/
    var macro = math.match(pattern)
    var key = macro ? macro.groups["express"] : ""
    var func = DictYiXue[key]
    if(func){
      return func(math)
    }else{
      return math
    }
}

然后找到以下函数

var katexInline = function(latex){
  options.displayMode = false;
  try{
    return katex.renderToString(latex, options);
  }
  catch(error){
    if(options.throwOnError){ console.log(error); }
    return latex;
  }
};

将其修改为

var katexInline = function(latex){
  options.displayMode = false;
  try{
    // 这里调用华鹤易学函数
      var tex = yixue(latex)
      return katex.renderToString(tex, options);
  }
  catch(error){
      if(options.throwOnError){ console.log(error); }
      return latex;
  }
};

最后重启 VSCode 就能顺利看到易学公式解释了。

Gitbook 中使用

book.json 文件中的 plugin 添加一个"huahe"插件,并安装 gitbook install 插件。

// book.json 引用插件以及配置
...
"plugins": [ ..., "huahe" ],
"pluginsConfig": {
    "huahe": { 
    "字体大小": 5, //字体大小 1~9 数字越大字体越大
    "水土共长生": true, //是否水土共长生
    "华鹤八字正偏财": true,  //是否使用华鹤偏财
    "开启短名": false, //是否使用短名,如“偏财”->“才”
    "Katex": true
  }
}
...

此插件支持两种渲染方式:

  • 运行时渲染
  • 编译时渲染

更详细的介绍以及最新的功能,请参阅 gitbook-plugin-huahe 项目。

Docsify 中使用

Docsify 是我个人对易学排盘管理的终极解决方案,强烈推荐。有兴趣的朋友请到我的个人笔记网站,其中的「生活/易学」下看看效果。

在 docsify 项目的 index.html 文档中找到下面这一行,

<script src="//unpkg.com/docsify/lib/docsify.min.js"></script>

然后在此行后面加入以下链接(注意顺序,否则可能无效)

<script src="https://raw.githack.com/maiernte/img/master/libs/docsify_plugin_huahe.js"></script>
<script src="https://raw.githack.com/maiernte/img/master/libs/bundle.js"></script>

<script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.js"></script>
<script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/contrib/auto-render.min.js"></script>

并且在 Header 中加入式样文档的链接

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css">

同样可以换成阿里云的文件地址,或者下载到本地。例如:

<!--其它脚本文件统一将地址前缀换成 http://huaheapp.oss-cn-hangzhou。。。 即可-->
<script src="http://huaheapp.oss-cn-hangzhou.aliyuncs.com/huahelibs/bundle.js"></script>

Docsify 配合我「开启本地应用」方案,可以在 localhost 非常方便的对文档进行修改。修改完成,用Git图形工具一键推送到服务器,即完成发布,在任何终端都可以浏览。

博客中使用

再次仅以 Hexo 博客为例,其它的博客请参考此例。原则上是找到修改post头文件的地方,并添加我提供的易学脚本。Hexo 中对数学公式的渲染有两个方案,Katex 和 MathJax, 其中 MathJax 是传统的方案,功能非常强大。Katex 是简约版,支持的功能少一些,但速度比MathJax快很多。而我的易学包只使用了渲染方案中万分之一不到的功能,所以推荐使用 Katex 方案。

🔔 注意:首先要检查自己的 Hexo 博客使用的渲染器是否默认开启了Katex或者MathJax数学插件。如果有的话需要卸载或者禁用数学插件,如果不能禁用,就必须更换Markdown渲染器。

因为系统使用的数学插件会在网页生成之前就改动数学表达,这样无法使用我提供给的函数库。我提供给博客的方案是在浏览网页的时候,即时渲染易学公式。

比如我之前用了 "hexo-renderer-markdown-it-plus" 渲染器就是强制使用 Katex 数学渲染的。

npm un hexo-renderer-markdown-it-plus --save // 卸载
npm i  hexo-renderer-markdown-it      --save // 更换

然后将下列代码添加到文件模版就可以了。使用 swig 模版的是在 <your thems>/layout/_custom/header.swig 或者 <your thems>/layout/index.swig 。而使用 ejs 模版的是文件 <your thems>/layout/layout.ejs

<!--前三行最好添加到 <header></header> 头区块中-->

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.css" >
<script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/katex.min.js" ></script>
<script defer src="https://cdn.jsdelivr.net/npm/[email protected]/dist/contrib/auto-render.min.js"></script>

<script src="https://raw.githack.com/maiernte/img/master/libs/bundle.js?华鹤=1&字体=5&水土=1&短名=1&katex=1"></script>

注意搜索 _config.yml 文件,"math", "katex", "mathjax" 等字样,发现有的话把他们禁用。

如果有特别需求,必须用MathJax渲染器的话,可以忽略上面的指令。正常的安装MathJax插件,然后找到 mathjax.swig 文件,引用我的脚步文件

<!-- 注意:这次 katex 参数的值为 0 -->
<script src="https://raw.githack.com/maiernte/img/master/libs/bundle.js?华鹤=1&字体=5&水土=1&短名=1&katex=0"></script>

自定义参数

如果希望修改全局性的参数,可以自定义一个 script ,并修改全局变量 settingYixue

<script>
    settingYixue["字体大小"] = 5 // 字体大小 1~9 数字越大字体越大
    settingYixue["水土共长生"] = true, // 是否水土共长生
    settingYixue["华鹤八字正偏财"] =  true,  // 是否使用华鹤偏财
    settingYixue["开启短名"] = false, // 是否使用短名,如“偏财”->“才”
</script>

results matching ""

    No results matching ""