在HTML中包含markdown文件内容供remark.js

有没有（最好是轻量级的方式）在HTML中包含降价文件的原始内容？在HTML中包含markdown文件内容供remark.js

我使用remark.js创建幻灯片，我想保持的降价文件从HTML分开，使HTML是非常简单的（不改变）：

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8" /> 
    <title>Test</title> 
    <link rel="stylesheet" href="style.css"> 
    <script src="https://gnab.github.io/remark/downloads/remark-latest.min.js"></script> 
    </head> 
    <body> 
    <textarea id="source"> 
     >>'paste' markdown file test.md<< 
    </textarea> 
     <script> 
     var slideshow = remark.create({ 
      highlightStyle: 'darkula', 
      highlightLines: true 
     }); 
     </script> 
    </body> 
</html>

理想情况下，它脱机运行并在本地机器上运行（无需运行Web服务器）。 '粘贴'markdown文件test.md'的位显然不起作用（因此我的问题）。我已经试过：

object data="test.md"而是产生一个丑陋的iframe
This solution但我只是得到了一个空白页面（我使用jQuery的一个CDN）。

来源

2017-01-12 Ian

根据remarkjs wiki你需要以下行添加到您的包含文件降价

var slideshow = remark.create({ 
    sourceUrl: 'markdown.md' 
});

下面是一个完整的例子

<!DOCTYPE html> 
<html> 
    <head> 
    <title>A title</title> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> 
    <style type="text/css"> 
     @import url(https://fonts.googleapis.com/css?family=Yanone+Kaffeesatz); 
     @import url(https://fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic); 
     @import url(https://fonts.googleapis.com/css?family=Ubuntu+Mono:400,700,400italic); 

     body { font-family: 'Droid Serif'; } 
     h1, h2, h3 { 
     font-family: 'Yanone Kaffeesatz'; 
     font-weight: normal; 
     } 
     .remark-code, .remark-inline-code { font-family: 'Ubuntu Mono'; } 
    </style> 
    </head> 
    <body> 
    <script src="https://remarkjs.com/downloads/remark-latest.min.js" type="text/javascript"> 
    </script> 
    <script type="text/javascript"> 
     var slideshow = remark.create({ 
     sourceUrl: 'your_file.md' 
     }); 
    </script> 
    </body> 
</html>

来源

2017-05-12 16:32:13 hungptit

在HTML中包含markdown文件内容供remark.js

回答

相关问题