为什么需要这样一个工具?

  每次预览 HTML 页面,都需要打开各种浏览器;哪怕不是调试,只是为了查看下效果;切换来切换去,各种刷新,感觉有些浪费时间;以前用过 DW 的实时预览,感觉这个功能很赞;又踏上了 atom 插件仓库慢慢寻找之路......

插件:atom-html-preview

  官方描述:A live preview tool for Atom Editor. 简言之:Atom编辑器内实时预览的工具

安装方法

  • 命令行安装:.atom/packages 下执行:apm install atom-html-preview

  • 页面安装:Atom->Preferences->install中搜索:atom-html-preview

快捷键:

  Press CTRL-SHIFT-H in the editor to open the preview pane

Atom 编辑器实时预览 HTML 页面经典方法的更多相关文章

  1. 用 grunt-contrib-connect 构建实时预览开发环境 实时刷新

    本文基本是参照着 用Grunt与livereload构建实时预览的开发环境 实操了一遍,直接实现能实时预览文件列表,内容页面.不用刷新页面了,这比以前开发网页程序都简单. 这里要用到的 Grunt 插 ...

  2. 自己动手开发更好用的markdown编辑器-04(实时预览)

    这里文章都是从个人的github博客直接复制过来的,排版可能有点乱. 原始地址 http://benq.im/2015/04/25/hexomd-04/   程序打包   文章目录 1. 打开新窗口 ...

  3. 一个支持实时预览的在线 Markdown 编辑器 - Markdoc

    最近组内需要为一些项目和系统写文档,发表在公司内的文档平台上,这个平台并不支持markdown,所以打算做一个在线markdown编辑器,支持实时预览,并且可以很容易的迁移发表到公司文档平台上,所以就 ...

  4. 实时预览的在线 Markdown 编辑器 - Markdoc

    实时预览的在线 Markdown 编辑器 - Markdoc 最近组内需要为一些项目和系统写文档,发表在公司内的文档平台上,这个平台并不支持markdown,所以打算做一个在线markdown编辑器, ...

  5. Sublime +Markdown+OmniMarkupPreviewer 搭建实时预览的markdown编辑器

    浏览器实时预览 <meta http-equiv="refresh" content="0.1"> auto save 的配置 {"aut ...

  6. [个人开源]vue-code-view:一个在线编辑、实时预览的代码交互组件

    组件简介 vue-code-view是一个基于 vue 2.x.轻量级的代码交互组件,在网页中实时编辑运行代码.预览效果的代码交互组件. 使用此组件, 不论 vue 页面还是 Markdown 文档中 ...

  7. Sublime写MarkDown实时预览

    [TOC] Sublime写MarkDown实时预览 Sublime作为神器,实至名归. 首先 1.安装Sublime,并安装Package Control,这里不多说. 2.安装MarkDown P ...

  8. Sublime、Webstorm等在APICloud平台上全面支持WiFi真机同步和实时预览功能

    APICloud工具插件包括APICloud Studio.Sublime Text和Webstorm全面为开发者提供iOS和Android平台真机同步调试功能,不仅可以通过USB方式进行APP真机同 ...

  9. MWeb 1.4 新功能介绍一:引入文件夹到 MWeb 中管理,支持 Octpress、Jekyll 等静态博客拖拽插入图片和实时预览

    之前在 MWeb 中打开非文档库中的 Markdown 文档,如果文档中有引用到本机图片,是没办法在 MWeb 中显示出来和预览的.这是因为 Apple 规定在 Mac App Store(MAS) ...

  10. APICloud全面支持WiFi真机同步和实时预览功能

    APICloud工具插件包括APICloud Studio.Sublime Text和Webstorm全面为开发者提供iOS和Android平台真机同步调试功能,不仅可以通过USB方式进行APP真机同 ...

随机推荐

  1. Django后台输出原生SQL语句

    如果需要打印orm翻译后的原生sql语句,只需要在setting最后加上下面代码就行. 1 LOGGING = { 2 'version': 1, 3 'disable_existing_logger ...

  2. 微软Bing正面对阵谷歌!竞标争夺Firefox默认搜索引擎

    在今早的谷歌I/O大会上,谷歌带来了全新的PaLM 2人工智能语言模型,并将用该模型升级Bard对话机器人以及谷歌搜索. 但面对来势汹汹的谷歌,微软似乎并不打算退却. 根据The Informatio ...

  3. 【预定义】C语言预定义代码(宏、条件编译等)内容介绍【最全的保姆级别教程】

    浅谈C语言预定义中的预定义符号,#define,以及符号#,##的相关运用 求个赞求个赞求个赞求个赞 谢谢 先赞后看好习惯 打字不容易,这都是很用心做的,希望得到支持你 大家的点赞和支持对于我来说是一 ...

  4. CH59X/CH58X/CH57X 片上flash的使用

    以CH592F为例:在使用时先看手册对code和data区的划分 一.DataFlash的读写的操作 先看几个操作dataflash的API(读擦写): /** * @brief read Data- ...

  5. Linux中查看dmesg中 ata1对应的盘符,以及SATA/NVME SSD的rescan/delete操作方法

    1.查看dmesg 中ata1 对应的盘符: Step1;  lsscsi -s 查看盘符(bdf) 对应的host Id: Step2: ll /sys/class/scsi_host  可以找到不 ...

  6. 使用V2R做反向代理内网穿透

    环境 内网服务器Prob1位于内网LAN1, 内网服务器Prob2位于内网LAN2, 外网服务器Serv1位于IP 123.123.123.123 内网节点配置 内网节点没有inbound,只需要配置 ...

  7. 【Unity3D】阴影原理及应用

    1 阴影原理 ​ 光源照射到不透明物体上,会向该物体的后面投射阴影,如果阴影区域存在其他物体,这些物体不被光源照射的部分就需要渲染阴影.因此,我们可以将阴影的生成抽象出 2 个流程:物体投射阴影.物体 ...

  8. Springboot实现remember-me记住我功能

    1.什么是remeber-me? remeber-me即记住我功能,是我们在登录web系统时的常见勾选项.当我们登录一个web系统时除了输入常规的用户名.密码后还可以勾选记住我选项(假设该系统提供了该 ...

  9. ORA-14550错误解决方法

    工作中修改临时表,报错: ---------------------------------- 以SYSDBA身份登录,执行以下语句: select a.sid, a.serial#,        ...

  10. ORACLE查询优化及gather_plan_statistics hint

    查询优化手段和gather_plan_statistics hint: 在10g以后我们可以通过利用gather_plan_statistics提示来了解更多的SQL执行统计信息,具体使用方法如下: ...