markrun('````js\nconsole.log(1)\n````',{template:''})
代码运行结果
<pre>console.log(1)</pre>
<script>console.log(1)</script>
如果能提供 markdownParser 接口,我就可以利用 markrun 在浏览器编译 jsx less
我晚上研究下,看下有没有支持的可行性,或许可以提供定制插件的功能
markrun 是对 markdown 中书写代码的一个增强,普通 markdown 可以用
```js
console.log('some')
```
书写代码块,最终以 pre包裹代码。
markrun 可对 四个 ` 符号 + 语言进行编译
````js
console.log('some')
````
比如 js 默认配置是生成
<pre>console.log(1)</pre>
<script>console.log(1)</script>
但也可以对 js 进行自定义配置,利用 浏览器中的 babel 编译js
````js
const str = `
abc ${document.title}
`
````
<pre>
const str = `
abc ${document.title}
`
</pre>
<script>
var str = "\n abc " + document.title + "\n";
</script>
我主要的目的是想 markrun + docsify 编译 jsx ,这样写文档就生成了示例。不需要维护文档代码和示例代码(容易出错)。
````js
ReactDOM.render(<App title="some" />, document.getElementById('node'))
````
```
<pre>
ReactDOM.render(<App title="some" />, document.getElementById('node'))
</pre>
<script>
ReactDOM.render(React.createElement(App, { title: "some" }), document.getElementById('node'));
</script>
```
平时我主要将 markrun 用在构建中,但是有些小型项目能直接用 docsify 结合 markrun 不构建能生成文档还能有示例就爽多了。
it would be very very slow 😂
@nimojs Hi
我会在下一个 minor version 支持这个特性,用法如下
window.$docsify = {
markdown: function (marked) {
return function (content) {
return markrun(content, {
markdownParser: marked
})
}
}
}
我有两点疑问:
marked#setOptions 的方法么,这样的话就可以改写成 function (marked) {
markrun.setOptions({
markdownParser: marked
})
return marked
}
如果没问题的话我将发布这个版本
-- update
1.5.0 已发布
@QingWei-Li 👍
我测试了一下,目前 docsify 提供的 markdown 函数接口能满足我的需求了。
我增加 setOptions 方法
我研究下,看是在 markrun 编译阶段直接 eval(source) 还是用别的方式。
docsify 浏览器编译react页面: https://markrun.github.io/markrun-docsify/
页面源码: https://github.com/markrun/markrun-docsify
Most helpful comment
docsify 浏览器编译react页面: https://markrun.github.io/markrun-docsify/
页面源码: https://github.com/markrun/markrun-docsify