最近在使用markdown做笔记,编辑器Sublime Text3用起来很轻巧,现在让他支持markdown的语法并且可以实时预览。

安装准备——安装Package Control

Package Control是一个开源的用于插件管理的插件,在为Sublime安装其他插件之前,需要安装它。它有两种安装方式Simple和Manual。此处我们选择simple方式来安装。

从菜单 View - Show Console 或者 ctrl + ~ 快捷键,调出 console。将以下 Python 代码粘贴进去并 enter 执行,不出意外即完成安装。以下提供 ST3 和 ST2 的安装代码:

  • Sublime Text 3:

    import urllib.request,os,hashlib; h = '2915d1851351e5ee549c20394736b442' + '8bc59f460fa1548d1514676163dafc88'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)

  • Sublime Text 2:

    import urllib2,os,hashlib; h = '2915d1851351e5ee549c20394736b442' + '8bc59f460fa1548d1514676163dafc88'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); os.makedirs( ipp ) if not os.path.exists(ipp) else None; urllib2.install_opener( urllib2.build_opener( urllib2.ProxyHandler()) ); by = urllib2.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); open( os.path.join( ipp, pf), 'wb' ).write(by) if dh == h else None; print('Error validating download (got %s instead of %s), please try manual install' % (dh, h) if dh != h else 'Please restart Sublime Text to finish installation')

    按下enter之后可以看见编辑器最下面有提示正在安装,安装成功后会弹出一个README的文档。

此时我们调出Command Paletter(Ctrl+Shift+P),输入pci会有以下几个选项

选择install package,enter后会加载repository中的插件。

搜索需要的插件按enter,等待几分钟,插件就安装好了。

安装MarkdownEditing

MarkdownEditing提供markdown编辑的基本辅助提示,也有自己的一套配色方案。安装此插件可以方便markdown的书写。打开Command Paletter,按照上述方法安装即可。

安装Markdown Preview或OmniMarkupPreviewer

这两个插件是用来预览markdown文档的。此处推荐OmniMarkupPreviewer,这个打开一次就可以实时预览自己编辑的内容(快捷键ctrl+alt+o)。
安装完OmniMarkupPreviewer后,默认是不支持mathjax公式的,需要支持,请修改配置文件,在user中增加以下配置即可。

  {"mathjax_enabled": true } 

安装完这两个插件之后,就可以利用sublime来写markdown文档的。

接下来推荐几个增强型的插件

Monokai Extended & Markdown Extended

提供一套Monokai的markdown主题,比原来的美观。

将Mardown GFM Settings-Default中的内容复制到Mardown GFM Settings-User中,然后在Mardown GFM Settings-User中修改如下:

Table Editor

用于编辑表格的工具。

开挂!实现浏览器自动刷新

对于浏览器而言,我们让它自动刷新只需在md文件最下面加入一行:

<meta http-equiv="refresh" content="0.1">

将写好的MarkDown文件转换成带目录的HTML文件

npm install -g i5ting_toc //在npm命令窗口全局下载i5ting_toc
i5ting_toc -f 文件名.md //在md文档路径下开启npm命令窗口,输入命令,就可以转换了


转载于:https://www.cnblogs.com/Jerry-MrNi/p/6844663.html

Sublime下MarkDown插件实现编辑和实时预览并转换成HTML格式相关推荐

  1. 如何在WordPress中显示链接的实时预览

    Have you ever seen sites that show a live preview of links when you bring your mouse over them? That ...

  2. Sublime Text3 的 Markdown 实时预览全面总结

    Sublime Text3 的 Markdown 实时预览全面总结 文章转自:https://blog.csdn.net/qq_20011607/article/details/81370236 0. ...

  3. Sublime Text 3 的 Markdown 实时预览全面总结

    Sublime Text 3 简介 http://www.sublimetext.com/ Sublime Text 3 : A sophisticated text editor for code, ...

  4. sublime 集成 markdown 插件【小明同学】

    sublime 集成 markdown 插件 安装 markdown 插件 Ctrl + Shift + p 进入 Browser Packages 输入 pcip (package control: ...

  5. VSCode中安装Live Server插件实现Html网页代码的实时预览

    VSCode中安装Live Server插件实现Html网页代码的实时预览 利用寒假时间学习了一些基本的网页知识,在编写Html代码时可以利用IDEA.WebStorm.Dream Weaver等工具 ...

  6. vue2实现海康威视根据海康插件进行监控实时预览和回放功能,全套代码,开箱即用。

    这是一套拿到手就能直接用的根据海康提供的摄像机节点实时预览和回放的全步骤代码,开箱即用. 前言 我的是基于vue2写的,vue3可以看我下一篇文章.  点击跳转至vue3关于海康视频开发文章. 很多人 ...

  7. Adobe xd的实时预览插件在哪里?

    今天跟大家分享一个我最近都在学习和用的软件:Adobe XD 跟大家讲一下这个软件吧!简介:Adobe XD是一站式UX/UI设计平台,在这款产品上面用户可以进行移动应用和网页设计与原型制作.同时它也 ...

  8. VSCode 实时预览HTML网页效果 - Live Server插件

    操作步骤 1.打开VScode,点击坐标工具栏的最后一个进入插件安装 2.在搜索框中输入Live Server,在搜索结果中找到Live Server,选择安装 3.实时预览,在文件上单击右键,选择O ...

  9. 在线编辑、在线预览、在线转换,基于wps.js + java + react / vue,无需任何插件,零安装

    基于wps.js在线编辑.在线预览.文档转换前台vue / react,后台java终于开源啦,无需任何插件,零安装,可以直接配置完打包部署,也可直接集成项目中,或者二次开发,后续会不定期更新,有好的 ...

  10. 支持Adobe xd的实时预览插件-标记狮

    如果你是刚入门的UI设计师,Adobe xd是一款免费安装的本地UI设计软件,免费安装入口教程: Adobe XD 官方正版及插件下载方法-常见问题-标记狮社区-UI设计免费素材资源UI教程分享平台 ...

最新文章

  1. 体积小巧、功能强大的代理工具 -- 3proxy
  2. 【CKEditor】下载历史版本4.8.x
  3. micropython会商用吗_NSF商用食品设备认证解析
  4. centos根分区扩容方法linux公社,Centos5给/根分区扩容
  5. SpringBoot2整合Activiti6工作流框架 源码
  6. 推荐一个牛逼的生物信息 Python 库 - Dash Bio
  7. HDU2526 浪漫手机【模拟】
  8. type=file 把默认的未选择文件换成别的_PS文件的新建、存储与格式
  9. 斐讯K2刷机加上桥接网络
  10. 打印机出现另存为xps_打印机打印文件时弹出另存为xps/pdf该怎办?
  11. 机器学习期末考试判断题
  12. Flash Platform 游戏开发入门
  13. python3 输出不换行
  14. 90后生态 | 我不敢看体检报告了!!!
  15. 网上兼职编程赚钱的那点事
  16. 第二届北京职教国际青年创新创业技能大赛启动
  17. 计算机师范专业发展预期,未来十年大有前途的专业,建议学生和家长多了解一下!...
  18. 接口中默认方法的重要作用
  19. 扫描文件转换成word软件
  20. c++详解缺省参数,缺省参数简介以及实际开发使用。

热门文章

  1. xcode 获取模拟器app沙盒路径_使用Xcode12进行App内购测试
  2. Linux系统编程 -- 多线程之基于环形队列的生产者与消费者模型
  3. es 时间字段聚合_ES聚合命令
  4. python one class svm_sklearn例程:OneClassSVM物种分布建模
  5. 设置IDEA修改html、jsp后立即生效,不用重启项目
  6. 6.4信号灯(Semaphores)
  7. Spring源码之ApplicationContext(四)功能补充
  8. Bean获取Spring容器
  9. [渝粤教育] 西南科技大学 物流信息系统 在线考试复习资料
  10. VC中ComboBox控件用法详解