请选择 进入手机版 | 继续访问电脑版
  • 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

ryanflorence/render-markdown-javascript: Renders markdown files to HTML with hig ...

原作者: [db:作者] 来自: 网络 收藏 邀请

开源软件名称(OpenSource Name):

ryanflorence/render-markdown-javascript

开源软件地址(OpenSource Url):

https://github.com/ryanflorence/render-markdown-javascript

开源编程语言(OpenSource Language):

JavaScript 100.0%

开源软件介绍(OpenSource Introduction):

Render Markdown JavaScript

Renders markdown files to HTML with highlighted code blocks BUT ALSO RENDERS THE JAVASCRIPT ONES.

screenshot

Why?

I've got a bunch of little JavaScript UI libs that don't need much more than a README.md for documentation, but a demo is worth a thousand README.md's, so I'd like the code in the README.md to actually render in a browser. Also great so people can copy/paste from the docs and know that it runs.

How?

Write normal markdown but for code fence blocks you want to have render in the browser also, use the "render" or "render-babel" language. Github markdown hates code fenced blocks inside of code fenced blocks, so I don't have an example here, look at the demo.md

How do I get JavaScript and CSS onto the page?

With <script>, <link>, and <style> of course.

<script src="https://unpkg.com/[email protected]/dist/react.js"></script>
<script src="https://unpkg.com/[email protected]/dist/react-dom.js"></script>
<link rel="stylesheet" type="text/css" href="https://unpkg.com/[email protected]/build/pure-min.css"/>
<style>body { color: red }</style>

# Then markdown as usual...

You can place your scripts at the bottom of the markdown file to prevent blocking your content from rendering, all scripts are run after DOMContentLoaded.

Also check out the demo.md file from the screenshot.

Does it babel?

Yes, first include babel standalone at the top of your markdown file and then use the render-babel language instead of render. Again, github hates code fence blocks inside code fence blocks here so I can't really show you in this README. Check out the demo

How Do I Attach Stuff to the DOM?

There will be a variable called DOM_NODE available to use, its the node for just that script.

CLI Usage

npm install render-markdown-js
render-markdown-js ./some-file.md > output.html

Node API Usage

const rmj = require('render-markdown-js')
const html = rmj('#string of markdown')

Options

There are none. Copy, paste, tweak.

Enjoy!

Please enjoy!




鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
JP1016/Markdown: 发布时间:2022-08-18
下一篇:
ProseMirror/prosemirror-markdown: ProseMirror Markdown integration发布时间:2022-08-18
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap