有的

為何尋找

每次預覽HTML頁面,都需要打開各種瀏覽器;哪怕不是調試,只是為了查看下效果;切換來切換去,各種刷新,感覺有些浪費時間;以前用過DW的實時預覽,感覺這個功能很贊;又踏上了atom插件倉庫慢慢尋找之路…..

插件:atom-html-preview

官方描述:AlivepreviewtoolforAtomEditor.簡言之:Atom編輯器內實時預覽的工具

獲取方式

1. 通過命令行安裝
2. 通過編輯器內部的install搜索安裝

使用方式及效果

快捷鍵

• 默認快捷鍵:CTRL+P調用,會和內置核心插件沖突(切換文件那個)—非常不好
• 修改版快捷鍵:CTRL+F12(感覺方便使用且沒有沖突的快捷鍵)

• 1
• 2
• 3

• 1
• 2
• 3

Tips:寫在keymap里面的權重是最高的….較新版本的atom內置了DevLiveReload這個插件;

這個插件的作用就是重新加載所有樣式和規則,有點類似Linux的sourcexx.sh一樣..即時生效調用快捷鍵是

當然,關閉atom再開atom編輯器也能達到重新加載所有樣式規則的效果….

效果圖

我用BS框架寫的頁面來測試….可以正確預覽,內部css是cdn也能正確識別

瀏覽器猜測

跑到該插件的github倉庫頁面,只看到一些cson規則,,沒有調用外部瀏覽器..

那么答案只有一個….就是chromium框架….所以內核應該也是blink以下是引用外部描述的atom[不知道是不是官方]

Web本地應用程序

Atom是一款基于Web技術的桌面應用程序，和其他桌面應用程序一樣，它也擁有自己的圖標、本地菜單、對話框以及訪問整個文件系統的權限。

無論你是調整Atom的CSS接口還是添加一些HTML和JavaScript主要功能，它都可以被你輕松控制，并且使用起來非常方便。