使用Atom打造无懈可击的Markdown编辑器
一直以来都奢想拥有一款全能好用的Markdown编辑器,直到遇到了Atom。废话不多说,直接开搞!
1. 安装Atom
下载安装Atom:https://atom.io/
2. 增强预览(markdown-preview-plus)
Atom自带的Markdown预览插件markdown-preview功能比较简单,markdown-preview-plus对其做了功能扩展和增强。
- 支持预览实时渲染。(Ctrl + Shift + M)
- 支持Latex公式。(Ctrl + Shift + X)
使用该插件前,需要先禁用markdown-preview。
查看实时渲染和公式编辑功能。
3. 同步滚动(markdown-scroll-sync)
同步滚动是Markdown编辑器的必备功能,方便翻阅文档修改时能快速定位到预览的位置。
markdown-scroll-sync不仅支持同步滚动,在光标位置发生变更时也会同步滚动,这个功能在很多Markdown编辑器中不具备。
4. 代码增强(language-markdown)
一般的Markdown编辑器提供了代码着色等基本功能,language-markdown除了能给代码着色,还提供了快捷的代码片段生成等功能。
5. 图片粘贴(markdown-image-paste)
图片功能支持的好坏直接决定了我是否选择使用一个Markdown编辑器。也有不少编辑器和在线的图床绑定,但是这种方式受限于网络。虽然Markdown支持插入本地图片,但是每次插入新图片都是一堆重复操作:截图-命名-保存-插入。markdown-image-paste将这些操作一步完成:
- 使用截图工具将图片复制到系统剪切板。
- 在Markdown新起一行输入文件名。
- Ctrl + V 会自动把图片保存到Markdown文件相同目录下(因此要求Markdown文件应该先保存),并命名为刚输入的文件名,同时在刚才输入文件名行处生成img标签。
当然,如果想插入gif动图就不能这么简单了,还是老老实实地下载这个工具手工插入吧。
LICEcap: http://www.cockos.com/licecap/
6. 表格编辑(markdown-table-editor)
一直对Markdown的table语法很无爱,直到遇到了markdown-table-editor,这操作效率简直炸了!文字已经不能表达我的激动之情了,直接看图吧。
7. pdf导出(markdown-themeable-pdf、pdf-view)
不少Markdown编辑器都会提供pdf导出功能,甚至将其作为收费功能。而Atom的markdown-themeable-pdf、pdf-view插件可以轻松实现pdf导出和预览功能。
安装markdown-themeable-pdf时遇到了一些坑,在此分享一下:
由于GFW的问题,导致该插件使用的phantomjs模块无法安装成功,从而导出pdf报告错误。
解决办法是:
- 从官网下载phantomjs二进制安装包:http://phantomjs.org/download.html
- 解压下载的phantomjs-2.1.1-macosx.zip压缩文件。
- 添加index.js文件到解压后的目录。
- 将整个目录的内容拷贝到:~/.atom/packages/markdown-themeable-pdf/node_modules/phantomjs-prebuilt,注意目录phantomjs-2.1.1-macosx被重命名为phantomjs-prebuilt
- 重启Atom,右键->Markdown to PDF即可,生成的pdf文件在Markdown文件同目录。
其中index.js文件内容为:
module.exports = {
path : __dirname + '/bin/phantomjs'
}
8. 总结
以上介绍的Atom的Markdown插件,基本上满足了我对一个Markdown编辑器的所有幻想,实时渲染、同步滚动,公式、代码、图片、表格的快捷操作与支持,以及pdf文件导出、预览等。希望此文对你有所帮助。
使用Atom打造无懈可击的Markdown编辑器的更多相关文章
- Atom打造优雅的MarkDown 编辑器
1.下载Atom https://atom.io/ 2.安装Atom 双击自动安装,会默认安装到C盘,无法修改. 3.安装simplified-chinese-menu 插件 这是一个可以将软件汉化的 ...
- 打造自己的Markdown编辑器
原文链接: http://www.errdev.com/post/5/ Markdown以其简洁的语法赢得了广大程序猿的喜爱,搜了一下github上相关的web编辑器,星星比较多的 Stackedi ...
- vscode打造最佳的markdown编辑器
参考:https://www.jianshu.com/p/18876655b452 在macos下也设置成功:
- 使用Codemirror打造Markdown编辑器
前几天突然想给自己的在线编译器加一个Markdown编辑功能,于是花了两三天敲敲打打初步实现了这个功能. 一个Markdown编辑器需要有如下常用功能: 粗体 斜体 中划线 标题 链接 图片 引用 代 ...
- 最新主流 Markdown 编辑器推荐
Markdown ,2004年由 John Gruberis 设计和开发,是一种可以使用普通文本编辑器编写的标记语言,通过简单的标记语法,它可以使普通文本内容具有一定的格式,以下将介绍目前比较流行的一 ...
- 好用的Markdown编辑器一览 readme.md 编辑查看
https://github.com/pandao/editor.md https://pandao.github.io/editor.md/examples/index.html Editor.md ...
- 好用的Markdown编辑器一览
Markdown 是一种简单的.轻量级的标记语法.用户可以使用诸如 * # 等简单的标记符号以最小的输入代价生成极富表现力的文档. Markdown具有很多优点: 写作中添加简单符号即完成排版,所见即 ...
- #第一用Markdown编辑器#
Markdown初次使用 This is a simple Markdown editor based on 'Markdown' it's * italic * style. it's also _ ...
- Atom打造 c/c++编译环境(忙了一个上午)
众所周知 Atom是一款非常酷炫的编辑器.因为它就像上古卷轴一样,玩家可以开发各种dlc补丁,实现自己想要的效果.所以Atom 可以被你改造成自己想要的东西,可以用来写算法竞赛题目,可以开发网页,可以 ...
随机推荐
- 关于BOM的理解
BOM提供了很多对象,用于访问浏览器的功能,这些功能与网页内容无关 BOM的核心对象时window,她表示浏览器的一个实例 window的双重角色 1.JS访问浏览器窗口的一个接口 2.ECMA ...
- Vue.js 系列教程 5:动画
原文:intro-to-vue-5-animations 译者:nzbin 译者的话:经过两周的努力,终于完成了这个系列的翻译,由于时间因素及个人水平有限,并没有详细的校对,其中仍然有很多不易理解的地 ...
- 剑指offer编程题Java实现——面试题5从头到尾打印链表
题目描述* 剑指offer面试题5:从尾到头打印链表 输入一个链表的头结点,从尾到头打印出每个结点的值 解决方案一:首先遍历链表的节点后打印,典型的"后进先出",可以使用栈来实现这 ...
- OSS最新进度汇报(2.25)
OSS系列最新进度情况如下:一. OSS.Social进度 1. 客服接口升级至新客服接口 2. BaseRecMsg中RecMsg字符串类型修改为xml类型 3. 添加Redis缓存注册实现,代码见 ...
- STM32中断优先级理解
STM32优先级理解 学习并使用STM32已经有一段时间了,记得先前一直不太理解STM32优先级中怎么设定抢占优先级和响应优先级,后来也是看了以为网友的博客才明白了STM32的优先级的设定到底是这么回 ...
- 开启AngularJS 1.X的学习之路(1)
概念(1) AngularJS 应用 AngularJS 模块(Module) 定义了 AngularJS 应用. AngularJS 控制器(Controller) 用于控制 AngularJS 应 ...
- Asp.net mvc 4.0 高级编程 百度云下载
Asp.net mvc 4.0 高级编程 百度云下载地址:链接:http://pan.baidu.com/s/1o6zFvOe 密码:xyss 1.基于 ASP.NET MVC4.0 + WebAPI ...
- ASP.NET Core MVC上传、导入、导出知多少
前言 本君已成夜猫子,本节我们来讲讲ASP.NET Core MVC中的上传,这两天才研究批量导入功能,本节顺便简单搞搞导入.导出,等博主弄妥当了再来和大家一并分享. .NET Core MVC上传 ...
- 每天一个Linux命令(18)--locate命令
locate让使用者可以很快速的搜寻档案系统内是否有指定的档案.器方法是先建立一个包括系统内所有档案名称及路径的数据库,之后当寻找时就需查询这个数据库,而不必实际深入档案系统之中了.在一般的 ditr ...
- js中字符串转换为数值的两种方法的区别
在js中字符串转换为数值的方法有三种:转换函数,强制类型转换,隐式转换 1.转换函数 parseInt() //将字符串转换为整型 parseFloat() //将字符串转换为浮点型 转换函数在 ...