经验首页 前端设计 程序设计 Java相关 移动开发 数据库/运维 软件/图像 大数据/云计算 其他经验
当前位置:技术经验 » 软件/图像 » Sublime Text 3 » 查看文章
Sublime Text3 插件安装
来源:cnblogs  作者:中国制造  时间:2018/9/25 19:36:09  对本文有异议

Markdown 编写+实时预览 及 Emmet 插件

Sublime Text3百度云盘下载

sublime Text3注册码及汉化教程博主:IMRIVER

编写+实时预览 插件安装

准备工作 通过命令在线安装插件

  • 按住Ctrl + Shift + P调出命令面板

  • 输入pci,显示Package Control: Install Package,回车

  • 输入插件名称进行安装

  • 安装时,左下角会有 [ = ] 动画

    • (如果还未安装 package Control 控件,选择Tool--->Install Package
      Control
      进行安装)

插件

插件名称 功能简介
Emmet 一个Web开发人员的工具包,可以大大提高你的HTML和CSS的工作效率
Markdown Editing Markdown写作者必备的插件
Markdown Preview 生成Html文件以及再浏览器中预览
MarkdownLivePreview 实时预览Markdown

1.Emmet

插件快捷写法https://blog.csdn.net/fengzijinliang/article/details/80187000

  • 安装好后进行验证,输入下方缩写,按 ctrl + e代码补全

    • 初始化 ! 或者 html:5
    • 缩写:!
    • 缩写:html:5
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
</body>
</html>
  • 示意图

2.Markdown Editing

MarkdownEditing是Markdown写作者必备的插件,它可以不仅可以高亮显示Markdown语法还支持很多编程语言的语法高亮显示。

ps:MarkdownEditing只针对 md\mdown\mmd\txt 格式文件才启用。

  • 示意图

3.Markdown Preview

启用方法:按住 Ctrl + Shift + P 调出命令面板,输入 mp ,选择 MarkDown Preview:Preview in Browser 加载默认浏览器渲染Markdown

  • 示意图

4.MarkdownLivePreview

实时预览Markdown文件,左侧为md文件,右侧为预览结果。可配合MarkdownEditing一起使用。

启用方法1:
MarkdownLivePreview默认关闭实时预览,既然安装这个插件了,那肯定是要用的。打开方式为在Preferences -> Package Settings -> MarkdownLivePreview -> Settings 的设置的右侧加一条 "markdown_live_preview_on_open": true,,重启sublime即可。
ps:为什么不能直接将左侧对应的false改为true,这是因为左侧为默认配置,是不能改的(只读),右侧的编辑区才是用户自定义区。

启用方法2:按住 Ctrl + Shift + P 调出命令面板,输入 mlp ,选择 MarkDown Preview:Preview in Browser 加载默认浏览器渲染Markdown

  • 示意图

  • 配合MarkdownEditing显示示意图

 友情链接: NPS