grunt-contrib-compass 中的 imagesDir 和 imagesPath 是什么？答案

【问题标题】：What's imagesDir & imagesPath in grunt-contrib-compass?grunt-contrib-compass 中的 imagesDir 和 imagesPath 是什么？
【发布时间】：2013-09-03 04:59:59
【问题描述】：

我正在使用grunt-contrib-compass，在设置中，有imagesDir 和imagesPath 之类的选项。我只是想知道它是做什么用的，我该如何使用它？

【问题讨论】：

为什么会有负面评论？这不是一个有效的问题吗？

标签： gruntjs

【解决方案1】：

显然这些选项要与compass URL Helpers 结合使用。如果您在Gruntfile.js 中指定了imagesDir，则可以调用compass 函数images-url() 来生成图像文件夹的路径。

例如，这是您指定 Gruntfile.js 的方式：

compass: {
  build: {
    options: {
      cssDir: './source/css/',
      sassDir: './source/css/',
      imagesDir: './source/images/',
      force: true,
      outputStyle: 'expanded',
    }
  }
}

这就是您从scss 文件中调用函数的方式：

background-image: image-url( 'test.png' );

当你运行任务时，它会被编译成：

background-image: url('/./source/images/test.png');

同样的事情适用于fontsDir，你只需要调用不同的compass函数font-url()。如果您想了解更多详情，请点击链接http://compass-style.org/reference/compass/helpers/urls/

【讨论】：

【解决方案2】：

我不确定它比文档的内容更清晰

[imagesDir](https://github.com/gruntjs/grunt-contrib-compass#imagesdir)
Type: String
The directory where you keep your images.

和

[imagesPath](https://github.com/gruntjs/grunt-contrib-compass#imagespath)
Type: String
Default: images
The directory where the images are kept. It is relative to the projectPath.

也许Compass's configuration reference 的定义也会有帮助？

images_dir: The directory where the images are kept. It is relative to the project_path. Defaults to "images".

images_path: The full path to where images are kept. Defaults to <project_path>/<images_dir>.

您可以像在 Gruntfile.js 中的任何其他选项一样指定这些：

compass: {
  staging: {
    options: {
      imagesDir: 'images'
    }
  }
}

注意：当您使用罗盘image-url helper 时，这些通常用于编译图像的正确路径。

【讨论】：

感谢您的回答，是的，我知道解释很清楚，但我真的不知道在编译方面要使用它。