分享

最方便简洁的设置Sublime编辑预览MarkDown

 cnxcy 2020-07-03

方便简洁的设置Sublime编辑预览MarkDown

Sublime中编辑markdown,安装一些插件来获得更好的体验.
需要安装一些插件.

插件的安装方法

  1. Ctrl+Shift+P打开控制台,Install Package Control等待安装成功
  2. 再次Ctrl+Shift+P在控制台,Package Control
  3. 依次输入需要安装的插件的名字, 等待片刻即可安装成功.

插件选择:

1.MarkdownEditing
2.MarkdownLivePreview
3.MarkdownPreview
4.Auto-save
5.LiveReload

预览方案:

  • 1+2 [方案一]
    • 直接在sublime中开另一个窗口预览, 能够实现同步显示
      • 优点: 方便简单
      • 缺点: 式样简陋不全有BUG,当使用分割线时,会吃掉分割线以下的内容.

  • 1+3+4+5 [方案二]
    • 使用浏览器预览,通过 [4] 完成浏览器读取, [5] 完成实时保存,同样可以实时预览
      • 优点: 美观大方, 显示效果出众
      • 缺点: 插件较多安装麻烦, 消耗较高.浏览器刷新时偶尔闪屏.

方案一:MarkdownEditing+MarkdownLivePreview

1.Editing安装好后, 重新打开.md文件的时候, 就会拥有一个新的界面.
更精确的语法高亮显示and十分丑的主题
修改设置: > Preferences>>Package Settings>>MarkdownEditing>>GFM Settings - User

配置:

{
    "color_scheme": "Packages/MarkdownEditing/MarkdownEditor-Dark.tmTheme",
    "draw_centered": false,
}

2.LivePreview安装后
Ctrl+Shift+P打开控制台MarkdownLivePreview: Open Setting
添加快捷键Alt+M
替换配置:

{
    "keys": ["alt+m"],
    "command": "open_markdown_preview"
}

重启之后即可通过快捷键预览所编辑内容.


方案二: MarkdownEditing+MarkdownPreview+LiveReload+Auto-save

1.Editing安装后如同上文配置.
修改设置: > Preferences>>Package Settings>>MarkdownEditing>>GFM Settings-User
配置:

{
    "color_scheme": "Packages/MarkdownEditing/MarkdownEditor-Dark.tmTheme",
    "draw_centered": false,
}

2.MarkdownPreview安装后配置
修改设置: > Preferences>>Key Blindings
添加内容:

    {
    "keys": ["alt+m"], 
    "command": "markdown_preview",
    "args": {"target": "browser", "parser":"markdown"}
    },

完成后,即可通过快捷键打开.md文件的浏览器预览页面.

3.Auto-save安装后
修改设置: > Preferences>>Package Settings>>LiveReload>>Settings - User
配置:

{
  "auto_save_on_modified": true,
  "auto_save_delay_in_seconds": 1,
  "auto_save_all_files": true,
  "auto_save_current_file": ".md",
  "auto_save_ignore_files": [".txt",".py"],
}

auto_save_delay_in_seconds更改保存频率.过程中觉得闪的话可以调低一些.
auto_save_ignore_files 忽略文件.如果无需要则可不变
完成后, 即可实时保存文件免却手动保存.

4.LiveReload安装后
修改设置: > Preferences>>Package Settings>>LiveReload>>Settings - User
配置:

{
    "enabled_plugins": [
    "SimpleReloadPlugin",
    "SimpleRefresh"
    ]
}

设置后, 每次调用预览页面即可自动实时加载, 免却手动刷新页面.

四个插件安装配置完成后, 即可实现通过浏览器页面显示预览

至此, 大功告成.
感谢阅读.

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多