国内引入jsrun.net代码分享预览提高可玩性 #906
Description
你在什么场景下需要该功能？
在前端里，分享设计与代码是很酷的玩法，国外有codepen和jsfiddle，国内目前很爽的方案有jsrun.net。通过代码的分享在线渲染会提高可玩性，促进代码水平的提高。
描述最优的解决方案
为了减少学习成本和实现难度，结合jsrun.net给的内嵌选项，有下面的思考解决方案
- 使用代码块声明jsrun
```jsrun
// 采用toml结构实现单一项配置，也可以通过vditor实现全局的配置，单一配置的优先级更高
[config]
theme = "dark" or "light"
src ="分享的demo地址(忽略http协议类型)"
type = "分享的仓库类型"
height = "输出的iframe的高度，默认为300"
\`\`\`
- 举个栗子，demo地址为 http://jsrun.net/G46Kp/edit
[config]
theme = "dark"
src = "jsrun.net/G46Kp"
type = "web"
- 输出结果为
<iframe width="100%" height="300" src="//jsrun.net/G46Kp/embedded/all/dark" allowfullscreen="allowfullscreen" frameborder="0"></iframe>- 如果主题是light的话
<iframe width="100%" height="300" src="//jsrun.net/G46Kp/embedded/all/light" allowfullscreen="allowfullscreen" frameborder="0"></iframe>默认允许所有的tabs存在
- 如果类型是JavaScript，demo的地址为 http://js.jsrun.net/c2aKp/edit
[config]
theme = "dark"
src = "js.jsrun.net/c2aKp"
type = "js"
- 输出结果
<iframe width="100%" height="300" src="//js.jsrun.net/c2aKp/embedded/quick/dark" allowfullscreen="allowfullscreen" frameborder="0"></iframe>默认使用极速运行
描述候选解决方案
与上面同理, codepen等其他的也可以通过配置文件的方式来进行配置，文件格式改为下面那样
[config]
engine = "使用的engine，codepen | jsrun | jsfiddle等"
theme = "可选主题"
src="分享的地址"
height = "可修改的iframe高度"
type = "分享的语言类型"