4

我有一个在 grunt 上运行的指南针任务，它生成一个已编译的base.css文件以及一些特定于页面的 css 文件。base.scss @imports一个_settings.scss部分，它规定了所有文件的一些全局设置。

compass: {
    theme: {
        options: {
            sassDir: '/sass',
            cssDir: 'css',
            fontsPath: 'css/fonts',
            imagesPath: 'img'

        }
    }
}

我希望能够多次调用罗盘任务，但每次都以某种方式规定在 base.scss 中导入不同的设置文件，并且 a 使用不同的cssDir输出。这是可以实现的吗？

我尝试使用以下方法，主要涉及在两个不同的罗盘任务中添加罗盘 config.rb（通过 raw）。每个任务都包含不同的导入路径，指向包含设置文件的目录。然后在我的 base.scss 顶部将该设置文件作为@import settings.scss拾取。

compass: {
    theme: {
        options: {
            httpPath: '/',
            sassDir: '/sass',
            cssDir: 'css',
            raw: 'add_import_path  "/sass/theme"'

        }
    },
    theme2: {
        options: {
            httpPath: '/',
            sassDir: '/sass',
            cssDir: 'css',
            raw: 'add_import_path  "/sass/theme2"'

        }
    }
}

这似乎可行，尽管感觉像是 hack，但它是我最接近可行的解决方案。似乎应该有办法做到这一点，但到目前为止，解决方案已经暗示了我。

我现在想知道是否可以使用 registerTask() 来创建我需要的功能，就像我在这里找到的那​​样：

以编程方式将参数传递给 grunt 任务？

4

1 回答 1

1

您当前的配置

我想您现在工作方式的主要警告是更改导入路径不适用于在主题之间共享内容。对此的建议是将两个非部分文件分开。

shared/
  _partial1.scss
  _partial2.scss
  _partial3.scss
  _partial4.scss
  _partial5.scss
  _base.scss
theme1.scss
theme2.scss

初始化每个主题的变量在每个主题#.scss 中。然后，如果您需要将其部署到相同名称下的不同文件夹，例如“base.css”，您可以使用另一个 grunt 插件，例如https://github.com/gruntjs/grunt-contrib-copy来复制每个主题#.css进入名为 base.css 的 theme# 文件夹。

在 theme1.scss 上，内容可能是：

$variable1: '';
$variable2: '';
$variable3: '';

@import 'base',
        'partial1',
        'partial2',
        'partial3',
        'partial4',
        'partial5';
于 2014-05-09T22:56:23.160 回答