使用Atom live-server时Sass编译报ERRNO::ENOENT错误，求解决方案

先明确：Atom Live-Server本身没问题，你完全不用换掉它，问题出在Sass编译的环节，咱们一步步排查解决：

1. 先搞定Sass的核心报错：ERRNO::ENOENT: No such file or directory #

这个错误直白来说就是Sass找不到你指定的sass/app.sass文件，你可以从这几个方向检查：

• 核对文件结构与后缀：
  确认项目根目录下真的有sass文件夹，且里面存在app.sass文件。这里要注意：Sass有两种语法后缀——.sass是缩进式语法（不用大括号和分号），.scss是类CSS的扩展语法。如果你的文件是.scss，要么把命令里的路径改成sass/app.scss，要么直接用sass --watch sass:css（不指定具体文件名的话，Sass会自动监听sass文件夹下所有.sass/.scss文件）。
• 确认命令执行目录：
  你必须在项目根目录下执行sass --watch sass:css命令。举个例子，如果你的项目结构是：

  我的项目/
  ├─ sass/
  │  └─ app.sass
  ├─ css/
  └─ index.html
  

  那你得先在终端里用cd命令进入「我的项目」文件夹，再执行Sass命令，不然Sass会在当前终端所在的目录找sass/app.sass，自然会找不到。
• 检查拼写细节：
  有没有把sass拼成sas或者saas？app.sass是不是写成了App.sass（部分系统区分大小写，大小写不匹配也会导致找不到文件）？

2. 为什么CSS样式没生效？ #

解决完Sass编译问题后，还要确认两个关键点：

• Sass编译成功后，css文件夹里会生成对应的app.css文件（如果源文件是app.sass），可以打开这个文件看看内容是否和你写的Sass对应。
• 你的HTML文件里要正确引用这个CSS文件，比如：

  <link rel="stylesheet" href="css/app.css">
  

  路径一定要对应，不然就算CSS生成了，页面也加载不到样式。

3. Atom Live-Server的正确打开方式 #

Live-Server只是帮你启动一个本地服务器，实现页面自动刷新，它不负责编译Sass。所以正确的流程是：

1. 先启动Sass监听（执行sass --watch sass:css，确保没有报错，能正常生成CSS文件）。
2. 再打开Atom Live-Server，这样当你修改Sass文件时，Sass会自动编译成CSS，Live-Server检测到CSS文件变化后会自动刷新页面，样式就能正常生效了。

总结：不是Live-Server的问题，先把Sass的路径和文件匹配问题解决，样式就能正常显示啦。

内容的提问来源于stack exchange，提问作者user8359832