本篇文章給大家介紹一下atom 編輯器實現html實時預覽的方法。有一定的參考價值，有需要的朋友可以參考一下，希望對大家有所幫助。
相關推薦：《atom》
基礎實現：
快捷鍵
立即學習“前端免費學習筆記（深入）”；
在編輯框中按 Ctrl + Shift + M 可以打開原生預覽。（不帶css樣式）
插件實現：atom-html-preview
點擊File->settings–>install-> 搜索 atom-html-preview ->下載
在編輯框中按 Ctrl + Shift + H 可以打開預覽面板（帶CSS樣式）
已經不需要像之前網上說的要修改快捷鍵了
插件實現：Dev Live Reload
調用快捷鍵：CTRL+SHIFT+ALT+R
稍微高級點，瀏覽器內打開
插件實現：brower-plus
在Atom內打開瀏覽器
插件實現：atom-live-server
在Atom外打開瀏覽器
快捷鍵比較多，可能和默認的有沖突，下一篇文章寫快捷鍵修改。
加入iis
不懂的可以查看百度百科https://baike.baidu.com/item/iis/99720?fr=aladdin
Atom+IE，實時編輯IIS網站目錄下的文件，寫完刷新就行。
如果使用chrome，則可以安裝LivePage 插件 ，實現頁面自動刷新。
插件實現：livereload
寫個gulp 任務跑 livereload插件，需要架成http。
不會Gulp可以入門：https://www.gulpjs.com.cn/
方法還有很多
使用browser-sync
browser-sync start –server -files “/.html,/.css”
寫在最后，既然你考慮選擇atom，那么就要一試到底，學習某個ide操作的時間成本是很高的，千萬不要三心二意。
更多編程相關知識，請訪問：atom！！
