什么是imagesDir&imagesPath在grunt-contrib-compass中？

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/