Sass无法编译 - Web Essentials 2013 Update 4

Question

我目前正在使用Web Essentials 2013更新4来支持在Visual Studio中编译.scss文件。

过去这个工具对我来说很好，但我刚创建了一个新的.scss文件，并将bootstrap un-minified css复制到这个新文件中。

保存后，屏幕右侧的编辑窗口无法更新或显示已编译的css或任何错误消息。同时，我的Visual Studio屏幕底部的蓝色条卡住了

  

为bootstrap.scss编译0依赖文件

通常我希望从这个以及bootstrap.min.css文件生成bootstrap.css文件，但这不会发生。

有没有人有任何想法如何将其恢复到正常工作状态？

Answer 1

这与我在WebEssentials-Settings.json文件中的设置有关。在版本3中，'UseRubyRuntime'参数需要标记为true以允许它自动编译到相关文件中。从版本4开始，这可以标记为false，因为我们现在有一个内置编译器，我认为可能与我试图使用的RubyRuntime版本冲突。

Answer 2

我遇到了类似的问题，安装Web Essentials 2013 Update 4后，.scss文件开始向输出中抛出这样的错误：

Something went wrong reaching: ... 
SCSS: Site.scss compilation failed: The service failed to respond to this request
Possible cause: Syntax Error!

我唯一的解决方案是：

  

  
1. 卸载Web Essentials
  
2. 删除％AppData％\ Local \ Microsoft \ VisualStudio \ 12.0
  
3. 删除％AppData％\漫游\ Microsoft \ VisualStudio \ 12.0
  
4. 修复VS 2013.4
  
5. 重新安装Web Essentials
        

来源：https://visualstudiogallery.msdn.microsoft.com/56633663-6799-41d7-9df7-0f2a504ca361/view/Discussions/1#15143

并提醒：如果您导入其他.scss文件，请确保它们位于正确的位置。当我通过NuGet更新Twitter.Bootstrap.Sass 3.3.3时，相关的.scss文件被移动到另一个文件夹，我不得不更新引用。例如：

在：

@import "../sass/bootstrap/_utilities.scss";

后：

@import "../stylesheets/bootstrap/_utilities.scss";

Answer 3

我遇到了同样的问题，并花了一些时间卸载并重新安装Web Essentials。我尝试删除似乎与Web Essential相关的AppData部分，但都没有成功编译scss文件。

所以我创建了一个新的.scss，内容很少，编译完成。然后我开始复制失败的碎片。经过几次复印，新版本也失败了。我能够把失败归零。 这是由这条线引起的：

  

$ highlightcolor：＃67a0f;

你看到了问题吗？十六进制颜色代码缺少一个数字。应该是67a0f5。修复此问题解决了原始文件的问题。

我查看了文件中的语法错误，但没有发现短颜色def。

我希望这可以节省一些时间和挫折。

Answer 4

引用更改日志，从2.5开始，用于Web Essentials的更新4：

  

  
• 删除了所有基于node.js的工具◦Sass/ LESS编译器   JSHint / JSCS
    linters CSS AutoPrefixer Handlebars编译器SweetJS / LiveScript
    编译器
  

http://vswebessentials.com/changelog

所以我的理解是，它不再编译。

Answer 5

我遇到了同样的问题，并且消除了实际的语法错误和错误的路径引用。我发现了两件事。

1. 当存在仅指定变量的文件时会发生这种情况 没有实际的scss或css标记。这对你而言更像是黑客攻击     可能必须将不需要的css放在变量文件中。
2. 关闭Autoprefixer将完全解决问题，但代价是不使用此功能。

Answer 6

我遇到了这个问题并确定当我运行编译所有SASS文件时，插件试图编译在项目的/ obj目录中找到的文件失败，从而导致后续编译失败。删除/ obj目录并重新启动VS修复了该问题。

Answer 7

我有一个类似的问题，并且在声明之前结果是对SASS变量的引用。没有警告或错误。一旦我将引用移动到正确的位置，它一切正常。

Answer 8

取消其他人对Web Essentials所说的内容。查看change log，它指出versions 2013 update 4及更高版本（也就是2015版本），

  

重要！ LESS，Sass和。的捆绑，缩小和编译   CoffeeScript不再是Web Essentials 2015的一部分。安装   新扩展Bundler＆amp;改为Minifier和Web编译器。另外，请参阅   此列表可能包含其他Web开发扩展   对你感兴趣。

我找到了Visual Studio的这个简洁的小扩展，它将保存的SCSS文件编译成一个CSS文件（以及该文件的缩小）。

你可以得到它here。 创建此扩展的人也谈到了Web Essential问题，发现here。