CFLMY-PPT自动生成记录文档004

前言

这是一个更新的版本，演示站点仍为：CFLMY-生成至美PPT

新增数学函数支持

直接使用markdwon-it-katex
使用npm安装

npm install markdown-it-katex

并导入依赖。

需要在header引入：

<!-- 数学函数支持 -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/KaTeX/0.5.1/katex.min.css">

新增视频支持

//Link.js
module.exports = function(md) {
    md.renderer.rules.link_open = function (tokens, idx, options, env, self) {
      const token = tokens[idx];
      const alt = tokens[idx + 1].content; // 获取链接文本
      const href = tokens[idx].attrs[token.attrIndex('href')][1];
  
      // 使用正则表达式给包含 "IMG-" 的 alt 文本设置类名
      const match_IMG = alt.match(/^(IMG)-(.*?)-(.*)$/);
      const match_VIDEO = alt.match(/^(VIDEO)-(.*?)$/);
      if (match_IMG) {
        const prefix = match_IMG[1]; // "IMG"
        const imgHref = match_IMG[2]; // "图片链接"
        const description = match_IMG[3]; // "描述"
        tokens[idx + 1].content = description;
        token.customMatch_IMG = true; // 添加一个自定义属性到 open token
        
        return `<a href="${href}">
                      <figure>
                        <img alt="" src="${imgHref}">
                        <figcaption>
                          <h2>
                    `;
      }
      else if(match_VIDEO)
      {
        const prefix = match_VIDEO[1]; // "IMG"
        const description = match_VIDEO[2]; // "描述" 预留字段
        tokens[idx + 1].content = description;
        token.customMatch_VIDEO = true; // 添加一个自定义属性到 open token
        
        return `<div class="wrap size-60">
                    <!-- Responsive video/iframe... Add <div class="embed"> -->
                    <div class="embed">
                        <iframe width="800" height="450" src="${href}" allowfullscreen></iframe>
                    </div>
                  <p class="videocaption" >
                    `;
      }
  
      // 默认行为
      return self.renderToken(tokens, idx, options);
    };
  
    md.renderer.rules.link_close = function (tokens, idx, options, env, self) {
      const token = tokens[idx-2]; // 获取对应的 open token
      if (token.customMatch_IMG) { // 检查是否存在 customMatch 属性
        delete token.customMatch_IMG; // 清除 customMatch 属性
        return `</h2>
                    </figcaption>
                  </figure>
                </a>`;
      }
      else if(token.customMatch_VIDEO)
      {
        delete token.customMatch_VIDEO; // 清除 customMatch 属性
        return `</p>
                </div>`;
      }
  
      // 默认关闭标签行为
      return self.renderToken(tokens, idx, options);
    };
  };

为链接格式转化为视频。

其他更新

• 增加脚注
• 新增css样式

待更新

• 发现背景图片部分存在Bug，不影响显示效果，但生成的html文件存在问题，后续需要修改。

后记

0.0.4版本新增了对视频和函数的支持。

---

同系列

CFLMY-PPT自动生成记录文档001
CFLMY-PPT自动生成记录文档002
CFLMY-PPT自动生成记录文档003
CFLMY-PPT自动生成记录文档003