编辑器实时预览 HTML 页面
为何寻找
每次预览 HTML 页面,都需要打开各种浏览器;哪怕不是调试,只是为了查看下效果;切换来切换去,各种刷新,感觉有些浪费时间;以前用过 DW 的实时预览,感觉这个功能很赞;又踏上了 atom 插件仓库慢慢寻找之路......
插件:atom-html-preview
官方描述:A live preview tool for Atom Editor. 简言之:Atom编辑器内实时预览的工具
获取方式
1.通过命令行安装
apm install atom-html-preview
2.通过编辑器内部的 install 搜索 atom-html-preview
安装
使用方式及效果
快捷键
- 默认快捷键:
CTRL + P
调用,会和内置核心插件冲突(切换文件那个) — 非常不好 - 修改版快捷键:
CTRL + F12
(感觉方便使用且没有冲突的快捷键)
#实时浏览器调用快捷键
'atom-text-editor':
'ctrl-F12':'atom-html-preview:toggle'
Tips
写在 keymap 里面的权重是最高的......较新版本的 atom 内置了 Dev Live Reload 这个插件;
这个插件的作用就是重新加载所有样式和规则,有点类似 linux 的 source xx.sh 一样..即时生效 调用快捷键是 CTRL + SHIFT + ALT +R
当然,关闭 atom 再开 atom 编辑器也能达到重新加载所有样式规则的效果......