【问题标题】:How to use npm Marked with HighlightJS如何使用带有 HighlightJS 标记的 npm
【发布时间】:2018-07-28 08:50:18
【问题描述】:

你如何使用 npm MarkedHighlightJS?我正在尝试自动化我的文档以进行解析和样式化。从标记的文档中查看以下示例:

// Using async version of marked
marked(markdownString, function (err, content) {
  if (err) throw err;
  // console.log(content);
});

// Synchronous highlighting with highlight.js
marked.setOptions({
  highlight: function (code) {
    return require('highlight.js').highlightAuto(code).value;
  }
});

console.log(marked(markdownString)); 

我看不到如何使用README.md 文件而不是带有手动转义特殊字符的字符串。使用示例不涉及对.md 文档的任何引用作为markdownString 的输入。

如何将 markdown 字符串作为文档传递(例如形成一个名为 README.md 的文件)而不是手动转义的字符串,并且最终输出还包括样式?

目标是能够传入一个 linted(我正在使用 VS 代码 markdownlint)README.md、主文档 CSS 和/或 highlightJS css,并具有最后一行的返回值(marked(markdownString) ) 是我可以直接写入.html 文件的东西。

另一个注意事项:我的降价文件还在多行代码块中指定语言。例如,我的 README.md 中的多行 JSON 块如下所示:

**BODY**:  

```JSON
{
  "username": "example@example.com",
  "p2setting": "4xx72"
}
```

【问题讨论】:

    标签: readme javascript-marked highlightjs


    【解决方案1】:

    根据this 帖子,文档曾经指定以下内容,但已从文档中删除:

    var fs     = require('fs');
    var hljs   = require('highlight.js');
    var marked = require('marked');
    
    var markdownString = fs.readFileSync('./README.md');
    
    marked.setOptions({
      highlight: function(code, lang) {
        return hljs.highlight(lang, code).value;
      }
    });
    
    var output = marked(markdownString);
    

    注意你需要指定编码fs.readFileSync('./README.md', "utf8")

    一个工作示例是:

    const fs     = require('fs');
    const hljs   = require('highlight.js');
    const marked = require('marked');
    
    const markdownString = fs.readFileSync('./README.md', "utf8");
    
    const style1 = fs.readFileSync('./node_modules/highlight.js/styles/railscasts.css', "utf8");
    // const style1 = fs.readFileSync('./node_modules/highlight.js/styles/solarized-dark.css', "utf8");
    
    marked.setOptions({
      highlight: function(code) {
        return hljs.highlightAuto(code).value;
      }
    });
    
    const doc = `<!DOCTYPE html>
    <head>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
      <title>Marked</title>
      <style>${style1}</style>
      </head>
      <body>${marked(markdownString)}</body>
    </html>  
    `
    fs.writeFileSync('./index.html',  doc);
    

    【讨论】:

    • 使用代码块时,如果没有选择语言,则会抛出错误Error: Unknown language: ""
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2023-03-05
    • 2021-11-05
    • 2011-03-13
    • 1970-01-01
    • 2014-11-23
    相关资源
    最近更新 更多