0

是否有可能用机车 CMS 的货车制作波旁威士忌？

我在旅行车的 Gemfile 中添加了波旁威士忌和整洁的宝石，但是在捆绑安装和启动服务器之后，我得到了这个：

 File to import not found or unreadable: bourbon.
 Load paths:
 /Users/alex/workspace/locomotive-test/public/stylesheets
 /Users/alex/.rbenv/versions/1.9.3-p392/lib/ruby/gems/1.9.1/gems/compass-0.12.2/frameworks/blueprint/stylesheets
 /Users/alex/.rbenv/versions/1.9.3-p392/lib/ruby/gems/1.9.1/gems/compass-0.12.2/frameworks/compass/stylesheets
 Compass::SpriteImporter
4

1 回答 1

2

我发现让 Locomotive 与 Bourbon（或 Susy 或任何插件 SASS gem）一起工作是一个两阶段的问题。首先，资源必须在 Wagon gemfile 中正确加载，然后必须@import在每个push依赖文件中编辑它们，以便在编辑到引擎时正确编译。

要让 Bourbon 正确导入 Wagon (1.5.1)，请按照示例模式将 Bourbon 添加到 :misc 组中的 gemfile 中：

group :misc do
  # Add your extra gems here
  gem 'bourbon', require: 'bourbon'
end

然后，只需运行$ bundle install，它应该可以正常工作。我发现我不需要$ bourbon install在我的 public/stylesheets 文件夹中做实际的 .css 文件。宝石对于我的 Wagon 实例来说已经足够了。

然而，将网站推送到 Engine 可能会很棘手。pushWagon 将在（参考：LocomotiveCMS Google Group）上以任意顺序编译 SASS 文件。因此，将所有@import调用放在一个主 sass 文件中并仅在顶级 application.css 文件中引用该文件的最佳 DRY rails 做法在这里不起作用：

./public/stylesheets
  -application.css #requires self and main
  -main.scss #imports all other stylesheets, normally where we'd @import 'bourbon'
  /other_stylesheets
    -variables.scss
    etc. etc.

On push，Wagon 不会@import在所有其他资源之前理解 main.scss ed Bourbon。因此，它通常会因“未定义的混合...”而失败

为了解决这个问题，我仍然将 variables.scss、mixins.scss 等放在一个文件夹中（例如 ./public/stylesheets/base/）并在每个页面特定样式表（posts.scss 等）上为这些资源调用 @import .)。此外，任何使用 Bourbon、Neat、Susy 的样式表，任何 mixin 都必须调用@import该 gem 引用以及mixin和变量......它必须在每个依赖表中重复。

./public/stylesheets
  -application.css # requires self and main
  -main.scss # imports all other stylesheets, normally where we'd @import 'bourbon';
  /other_stylesheets
    -variables.scss # might @import 'font-awesome';
    -mixins.scss # @import 'bourbon'; @import 'variables'; 
    etc. etc.

不幸的是，这不是非常干燥的编码。事实上，可能有很多可以消除的臃肿和冗余。到目前为止，这是我找到push的使用这些 gem 将我的 Wagon 站点连接到引擎的最可靠的方法。话虽如此，如果您正在寻找快速修复，而不是@import为每个页面识别每个资源，您可以制作一个 import.scss 样式表，它调用 Bourbon、Neat、what-have-you 和@import那个 import.scss 资源进入其他每张纸。

最后一个问题（著名的遗言！）是引擎不接受 .scss 或 .sass 文件，尽管有文档。预处理器样式表必须以 .css 开头：

main.scss => main.css.scss

否则，引擎会返回错误“您不允许上传...”

希望有帮助！

更新：

在发布这篇文章几周后，我意识到 Locomotive 与其他 Rails 应用程序中 Sass 问题的原因：我在 application.css 文件中使用了旧的 sprockets 语法。

因此，最好的方法是制作尽可能多的Sass 表格部分（在文件名前加上下划线 -> _example.css.scss）。然后，将 application.css 更改为 Sass 表 -> application.css.scss。最后，不要*= require像我们过去对 Sprockets 那样使用任何调用。相反，我们可以而且应该使用 Sass@import调用的 Rails 最佳实践。如果愿意，您甚至可以将您的部分文件放在子文件夹中。原因是，机车默认安装 sass-sprockets 和 sass-rails gems。这些宝石使@import在带有 sprockets/asset 管道的 application.css.scss 文件中。通过将 Sass 部分用于后续样式表，application.css.scss 的编译将拥有自己的域并将部分调用到其中，而不是在其自己的域中编译每个后续表。否则，您可能会wagon push在主应用程序表之外的第一张表上看到“未知混合...”失败。如果您以正确的依赖顺序对您的部分进行排序（每个工作表需要哪个文件？首先...），此方法还有一个额外的好处，即保持您编译的应用程序样式表非常干燥。

干杯!

于 2015-01-05T15:01:36.950 回答