Atom是GitHub推出的一款轻量且可高度扩展的代码编辑器，很多前端初学者喜欢用它来写HTML。不过Atom本身只是一个文本编辑工具，并不像某些IDE那样自带一键运行按钮，所以我们需要通过一些方法让写好的HTML在浏览器里跑起来或者实时预览。
方法一：使用atom-html-preview插件实时预览
这是最方便的可视化方案，安装后可以直接在编辑器右侧看到渲染效果。
安装步骤
- 打开Atom，点击菜单栏的File - Settings
- 进入Install选项卡，搜索atom-html-preview
- 点击Install完成安装，重启Atom
安装好后，在HTML文件内右键选择Preview HTML，或者使用快捷键Ctrl+Shift+H即可看到页面效果。
方法二：用script插件运行并调用浏览器
script插件可以执行脚本命令，我们可以写个简单脚本用系统命令打开HTML。
配置示例
# 在Atom的script运行配置中，可以使用如下命令打开文件 # macOS系统 open "$1" # Windows系统 start "$1"
将上面命令保存为运行脚本，选中HTML文件后执行，就会自动调用默认浏览器打开页面。
方法三：手动在浏览器打开
如果不想装插件，最原始的办法就是找到文件位置，双击或用浏览器打开。
| 系统 | 操作方式 |
|---|---|
| Windows | 资源管理器进入文件目录，双击html文件 |
| macOS | Finder中右键用浏览器打开 |
方法四：使用终端命令
Atom自带底部终端（需装platformio-ide-terminal），在文件目录执行命令：
# 假设文件名为index.html # Linux xdg-open index.html # macOS open index.html
代码中的标签注意事项
写HTML时，像<div>、<p>这样的标签只是标记语言结构，不会被Atom执行。若要在文章里说明某个标签，记得转义写成<input>形式，避免被解析。函数调用如alert()属于脚本行为，不等于<script>标签本身。
小结
通过上述几种方式，你可以轻松在Atom程序里运行HTML。推荐新手先用atom-html-preview插件，写页面时能即时看到改动，等熟悉之后再搭配终端命令，工作流会更灵活。