Compass/SASS - 并非所有文件都被编译
Posted
技术标签:
【中文标题】Compass/SASS - 并非所有文件都被编译【英文标题】:Compass/SASS - not all files are compiled 【发布时间】:2014-07-04 00:42:40 【问题描述】:我不知道是否可以在不粘贴所有文件的整个代码的情况下解释问题,但我会尝试。
编辑我已将整个代码添加到 Github 帐户 - My Sass structure
我使用的是 Windows 8.1 和 Compass 0.12.6
在我的 public_html 文件夹中,我有 config.rb 文件和 stylesheets 文件夹。在 stylesheets 文件夹中,我有目录 sass,我保存所有 sass 文件。 CSS 文件生成到 stylesheets/preview 文件夹(用于开发目的)和 stylesheets 文件夹(用于生产目的)。
我运行 compass 观看我在 public_html 文件夹中运行的 watch.bat 脚本
watch.bat 的内容是:
START compass watch -c config.rb -e development
START compass watch -c config.rb -e production
EXIT
我的 config.rb 文件是:
require 'compass/import-once/activate'
# Require any additional compass plugins here.
# Set this to the root of your project when deployed:
http_path = "../"
sass_dir = "stylesheets/sass"
images_dir = "img"
javascripts_dir = "js"
cache = false
relative_assets = true
add_import_path "stylesheets/sass"
if environment == :development
css_dir = "stylesheets/preview"
line_comments = true
output_style = :nested
end
if environment == :production
css_dir = "stylesheets"
line_comments = false
output_style = :compressed
end
在 stylsheets/sass 中,我有 4 个文件 print.scss 、 medium.scss、small.scss 和 large.scss
medium.scss 和 large.scss 都以:
@import "base/_init";
这个文件从基本文件夹导入部分_init,这个文件加载另一个部分,其他部分加载另一个部分。
问题是当我在部分 Compass 中更改某些内容时,并不总是编译所有必要的输出文件。例如,我刚刚在 _settings.scss 部分中更改了一些内容,这个最终由 medium.scss 和 large.scss 加载(我提醒这两个文件具有相同的开头,因此它们都应该被编译)。不知何故,实际上只监视了 medium.scss 文件,而 large.scss 文件没有按照这种情况进行编译。
我以前也遇到过这种情况。我停止了 2 个观察者(CTRL + C 和 Y),然后再次运行我的 watch.bat 而不更改文件中的任何内容 - 运行后我有信息:
在 15:51:33 检测到更改为:large.scss overwrite stylesheets/preview/large.css Compass 正在轮询更改。按 Ctrl-C 停止。
和
在 15:51:33 检测到更改为:large.scss 覆盖样式表/large.css Compass 正在轮询更改。按 Ctrl-C 停止。
所以实际上应该注意一些变化,但不知何故 compass/sass 并不总是能捕捉到它。
有时 2 个观察者都没有捕捉到变化,我必须阻止它们并再次运行 watch.bat,所以这样工作不是很方便。
有时甚至会发生观察者被停止(当我按下 CTRL + C + y 时)但我没有按下任何东西,并且在 cmd 中没有关于关闭可见的问题。他们刚刚停下来
问题:可能出了什么问题以及如何解决?
【问题讨论】:
提示:你能用你当前的项目结构在 Github 中创建一个 repo 吗?这样,这里的某个人就可以克隆它并重现您的环境。 感谢您的建议。我刚刚将我的项目结构添加到 github 【参考方案1】:我不知道如何解决你的问题。
我认为基本上这是两个指南针实例在同一个文件夹上同时运行的错误或问题。
但是由于您的环境,我有一个建议可以为您解决问题。
为什么,不是有两个包含资产的文件夹,而是一个用于产品的文件夹。和dev.,你只保留一个,为两个dev。和产品。
您可以在 compass 上设置的内容是以您想要的方式输出 css 以供开发人员使用。然后将该 css 通过 yui 过滤器(或其他)传递给 prod。这将缩小所有资产。例如,如果您使用的是 symfony,则可以使用资产。 这就是我们的工作方式和完美的工作方式。我们不使用资产作为指南针......这是另一个话题:D
如果您不使用任何框架或额外的过滤器,您始终可以在这些资产准备好投入生产时手动转储这些资产。
这样可以避免同时使用两个 compass 实例,并且还可以为生产中的每个部署手动编译。
我真的认为这与运行两个指南针实例有关。
【讨论】:
【参考方案2】:我已经克隆并检查了您的项目结构,您的问题只是对 Import Once 插件的不必要使用。如果您注释 config.rb 的第一行(激活此插件的位置),您的样式表将正常编译。您拥有的每个主要 scss 文件(large.css、medium.css、small.css)都会呈现为一个单独的 css 文件,并且您不会为这些文件中的每一个重复导入。
以下是禁用 Import Once 插件后的导入顺序:
【讨论】:
您能否解释一下它对我当前的项目有何影响?据我所知,这个指令在我使用 import 'aaa'; 时会这样做。导入“aaa”; 'aaa' 只会被导入一次。问题是有时一切正常,有时却没有(我还没有测试过评论这一行) 虽然我从未使用过这个插件,但我认为它忽略了已导入文件中的更改(例如:如果您要导入 _init.scss 两次,一次在 large.scss 中,第二次在 medium.scss 中的时间,最后一个 @import 将被忽略,这是一个完全错误的行为,一旦你真的需要在这两种情况下导入这个文件)。 import-once 有一个很好的目标,但是当相同的部分包含在多个(输出).scss 文件中时确实会导致问题。尽管是“最佳实践”,但指南针似乎完全适用于具有单个输出文件的项目。 github.com/Compass/compass/blob/master/import-once/README.md以上是关于Compass/SASS - 并非所有文件都被编译的主要内容,如果未能解决你的问题,请参考以下文章