0

当您有一个使用 sass @import 导入其他样式表的包装器样式表时,并且当使用 guard 来监视更改时,如果您只更改其中一个导入的文件,它不会自动编译包装器样式表。例子:

/* This is viewports.scss, which must compile into viewports.css */
@media only screen and (min-width: 480px) {
    @import "480.scss";
}

@media only screen and (min-width: 768px) {
    @import "768.scss";
}

@media only screen and (min-width: 1024px) {
    @import "1024.scss";
} 

例如,在修改 480up.scss 时,它会按预期编译为 480up.css,但 Guard 并未将其导入 viewports.css,似乎无法识别依赖关系。当您想在一个已编译的 css 中实现响应式,但在单独的 scss 文件中编写代码时,这种用法很重要。

如果您只使用 sass 命令,您将获得预期的行为,如果您使用 Guard,则不会。

有一些解决方法吗?我需要配置一些额外的东西吗?

4

1 回答 1

0

Guard 对文件的依赖关系一无所知,只是提供了轻松处理文件系统修改事件的基础。我看到 sass 有两个 Guard 插件:

我会选择guard-sass,因为它得到了积极的维护。当我阅读文档时,我看到

:smart_partials => true # Causes guard-sass to do dependency resolution and only
                        # recompile the files that need it when you update partials.
                        # If not on, then guard-sass will update all files when a
                        # partial is changed.
                        # default: false

所以看起来guard-sass应该已经正确处理了你的案子。

于 2013-04-01T13:52:58.740 回答