罗盘中的imagesDir & imagesPath是什么？

Question

我使用的是grunt-contrib-compass，在设置中，有imagesDir和imagesPath这样的选项。我只是想知道这是干什么的，我该怎么用呢？

Answer 1

很明显，与compass URL Helpers一起使用的选项。如果在imagesDir中指定了Gruntfile.js，则可以调用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/链接

Answer 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.

也许罗盘构型基准的定义也会有帮助？

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'
    }
  }
}

注意:当您使用罗盘图像url助手时，这些通常用于编译正确的图像路径。