带有 LTR 和 RTL 的 Rails 预编译资产 SCSS

【问题标题】：Rails precompiled assets SCSS with LTR & RTL带有 LTR 和 RTL 的 Rails 预编译资产 SCSS
【发布时间】：2015-06-16 05:50:36
【问题描述】：

这个不容易！

我正在构建一个在两个区域设置 AR 和 EN（RTL 和 LTR）之间切换的页面页面是使用 SCSS bootstrap v3 构建的。

我已经让所有 Boostrap 文件基于一个单一的 SCSS 标志（即 $flag-direction）在左右之间切换

我现在主要关心的是如何处理生产环境中的资产管道？在 RTL 和 LTR 标志之间切换时，事情似乎工作正常。但在生产中，它只在版本上创建，然后开始提供该版本。有人解决这个问题吗？

我总能找到这样的解决方案：http://dolinked.com/questions/229493/maintain-rtl-version-of-stylesheets-with-rails-asset-pipeline 这有点吓人，因为它的工作量太大了。有没有更简单的？

谢谢！

【问题讨论】：

【解决方案1】：

据我所知，您希望将所有代码编译成一个 CSS 文件？除非您自己更改 Bootstrap 代码，否则我希望您会加载许多未使用的 CSS 代码。如果您能够有条件地设置 HTML 的文本目录，您还应该能够动态加载 CSS 文件并为每个文本方向编译一个 CSS 文件。

否则你可以使用 Sass 的nested @import 功能：

使用 grid.scss：

@at-root body#{&} {
direction: $direction;
}
.row {
float: $float;
}

以下代码：

.rtl {
$direction: rtl;
$float: left;
@import "grid.scss";
}


.ltr {
$direction: ltr;
$float: right;
@import "grid.scss";
}

编译成CSS代码如下：

body.rtl {
  direction: rtl; }
.rtl .row {
  float: left; }

body.ltr {
  direction: ltr; }
.ltr .row {
  float: right; }

【讨论】：