备战美赛期间,向岳神学习,搞了Atom玩协作开发,第一次没有自动补全的手撸了遗传算法。今天发现Atom还有写Markdown的妙用,遂拿来练手。

1. 安装Atom

下载安装Atom:https://atom.io/

2. 增强预览(markdown-preview-plus)

Atom自带的Markdown预览插件markdown-preview功能比较简单,markdown-preview-plus对其做了功能扩展和增强。

  1. 支持预览实时渲染。(Ctrl + Shift + M)
  2. 支持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将这些操作一步完成:

  1. 使用截图工具将图片复制到系统剪切板。
  2. 在Markdown新起一行输入文件名。
  3. 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报告错误。

解决办法是:

  1. 从官网下载phantomjs二进制安装包:http://phantomjs.org/download.html
  2. 解压下载的phantomjs-2.1.1-macosx.zip压缩文件。
  3. 添加index.js文件到解压后的目录。
  4. 将整个目录的内容拷贝到:~/.atom/packages/markdown-themeable-pdf/node_modules/phantomjs-prebuilt,注意目录phantomjs-2.1.1-macosx被重命名为phantomjs-prebuilt
  5. 重启Atom,右键->Markdown to PDF即可,生成的pdf文件在Markdown文件同目录。

其中index.js文件内容为:

module.exports = {
path : __dirname + '/bin/phantomjs'
}

8. 总结

以上介绍的Atom的Markdown插件,基本上满足了我对一个Markdown编辑器的所有幻想,实时渲染、同步滚动,公式、代码、图片、表格的快捷操作与支持,以及pdf文件导出、预览等。希望此文对你有所帮助。

Reference:http://www.cnblogs.com/fanzhidongyzby/p/6637084.html

Atom-无懈可击的Markdown编辑器的更多相关文章

  1. 使用Atom打造无懈可击的Markdown编辑器

    一直以来都奢想拥有一款全能好用的Markdown编辑器,直到遇到了Atom.废话不多说,直接开搞! 1. 安装Atom 下载安装Atom:https://atom.io/ 2. 增强预览(markdo ...

  2. Atom打造优雅的MarkDown 编辑器

    1.下载Atom https://atom.io/ 2.安装Atom 双击自动安装,会默认安装到C盘,无法修改. 3.安装simplified-chinese-menu 插件 这是一个可以将软件汉化的 ...

  3. 好用的Markdown编辑器一览 readme.md 编辑查看

    https://github.com/pandao/editor.md https://pandao.github.io/editor.md/examples/index.html Editor.md ...

  4. 好用的Markdown编辑器一览

    Markdown 是一种简单的.轻量级的标记语法.用户可以使用诸如 * # 等简单的标记符号以最小的输入代价生成极富表现力的文档. Markdown具有很多优点: 写作中添加简单符号即完成排版,所见即 ...

  5. 好用的Markdown编辑器汇总

    Markdown 是一种简单的.轻量级的标记语法.用户可以使用诸如 * # 等简单的标记符号以最小的输入代价生成极富表现力的文档. Markdown具有很多优点: 写作中添加简单符号即完成排版,所见即 ...

  6. Linux编辑器篇-分享10个最好的Markdown编辑器

    在这篇文章中,兄弟连Linux培训会分享一些可以在 Linux 上安装使用的最好的 Markdown 编辑器.虽然你在 Linux 平台上能找到非常多的 的 Markdown 编辑器,但是在这里我们将 ...

  7. Github Atom开源文本代码编辑器- 由 Github 打造的下一代编程开发利器

    个人理解:Github 热度超凡的一个项目Atom,electron是整个atom的核心,对于electron可以理解成 electron =io.js + Chromium    通过 Electr ...

  8. Markdown编辑器开发记录(二):Markdown编辑器的使用与开发入门

    Markdown编辑器的使用与开发入门 在部门做技术分享的时候简单整理了一下手里的资料 1 是什么 1.1 Markdown是一种轻量级标记语言 Markdown是一种轻量级标记语言,创始人为约翰·格 ...

  9. 介绍3款Markdown编辑器

    为什么写此篇  自从CSDN的博客有了Markdown后,慢慢的了解并学会了用Markdown语法写博客.但CSDN博客是在浏览器中使用,于是一直寻找离线的Markdown编辑器.  网上先是找到了M ...

随机推荐

  1. IOS 某个控件出不来原因(经验分享)

    某个控件出不来:(检查原因) 1.frame的尺寸和位置对不对 2.hidden是否为YES 3.有没有添加到父控件中 4.alpha 是否 < 0.01 5.被其他控件挡住了 6.父控件的前面 ...

  2. 索引属性 unique指定

    比较重要的属性有: 名字 db.collection.ensureIndex({},{name:''}) 在创建索引时,mongodb会自己给索引创建默认的名字,这种名字并不好记,我们看一下mongo ...

  3. python_20_列表

    #1 names=["QiZhiguang","DaiYang","HuZhongtao","ZhangDong"] p ...

  4. React后台管理系统-登录页面

    登录页面 <div className="col-md-4 col-md-offset-4">                <div className=&qu ...

  5. React后台管理系统-ajax请求封装

    1.新建文件夹 util , 在util里边新建 mm.jsx文件 2.使用jquery里边的ajax发送请求,回调用promise,返回一个promise对象 request(param){     ...

  6. Servlet 的生命周期 及 注意事项 总结

    Servlet的生命周期 图解Servlet的生命周期 生命周期的各个阶段 实例化 :Servlet 容器创建 Servlet 的实例 初始化 :该容器调用init() 方法 请求处理 :如果请求Se ...

  7. oc不可变数组创建

    //创建数组 //1.快速创建数组  @[] NSArray *week=@[@"MON",@"TUE",@"WED",@"THU ...

  8. mongodb添加管理员密码

    use admin db.createUser( { user: "adminUser", pwd: "adminPass", roles: [ { role: ...

  9. javascript oo实现

    很久很久以前,我还是个phper,第一次接触javascript觉得好神奇.跟传统的oo类概念差别很大.记得刚毕业面试,如何在javascript里面实现class一直是很热门的面试题,当前面试百度就 ...

  10. node.js express环境下中文需要注意的地方

    问题一: 最近在nuxt项目中开始着手把一些跨域的请求转移到express里,其实跟其他语言差不多,http对象发请求,接收请求都写得很顺畅.之前用的请求部分大多数是get请求,所以除了注意编码问题之 ...