通过armin-pfaeffle使用Atom Plugin sass-autocompile编译成多个.scss文件

时间:2016-12-04 16:34:18

标签: sass atom-editor auto-compile

我很确定这个插件是否可以实现,但我目前的问题是我维护了一个大型的SCSS项目,它有三个方面,我实际上想要保存三个不同的CSS文件。

我有三个主要文件:

  1. core-something_1.scss
  2. 芯something_2.scss
  3. 列表项
  4. 芯something_3.scss

    所有文件都需要相同的重置颜色等。这就是为什么它们都在一个SCSS项目中。为了能够编译我需要添加注释: // main: ../core-something_1.scss

    这只会编译一个文件,这是有道理的,但有可能添加smth。像这样: // main: "../core-something_1.scss", "../core-something_2.scss", "../core-something_3.scss"

    结果将是它为我自动编译三个文件。最好的情况是摆脱这些注释,只需自动检查scss子文件的调用位置并编译它们。我过去常常和#34; Coda by Panic"几个星期前,他已经开始转向Atom了。在Coda一切正常,没有任何评论。也许有人可以提供帮助。谢谢! :)

    链接到插件:https://github.com/armin-pfaeffle/sass-autocompile

3 个答案:

答案 0 :(得分:1)

聚会晚了一点,但是对于其他抱怨部分文件并且保存时未编译为主文件的人,我可能有解决方案。

我在所有_partial文件中都使用了这个注释掉的行。这告诉SASS编译部分文件并将其添加到主文件中:

// main: main.scss

很明显,将main.scss更改为主文件名,并将其放在样式表的第一行。

答案 1 :(得分:0)

如果您需要在整个网站中维护一组常用颜色,最好将其拆分为部分并将其引用到每个scss文件中?

@import 'reset-colors';

答案 2 :(得分:0)

在Atom sass-autocompile设置中选择/勾选选项“保存时编译”和“使用'扩展'输出样式编译”

定义'扩展'输出样式文件路径 - > ../css/$1.css

当你保存/编译你的main.scss文件时,它会在你的主项目中创建一个'css'文件夹,你将有一个输出.css文件。

您应该导入所有_core-something1.scss_core-something2.scss放入main.scss文件。

@import "core-something1"; @import "core-something1";

您无需编译编辑/保存main.scss

所需的单个文件