gruntjs - yeoman 构建 compass bootstrap scss 图像路径总是前缀 '../'

Question

问题出在bootstrap sass中，图标精灵路径是图像之前的所有方式前缀“../”，

'../../images/../images/glyphicons-halflings-white.png'

我希望喜欢这个'../images/../images/glyphicons-halflings-white.png'

咕噜文件配置：

  options: {
    sassDir: '<%= yeoman.app %>/styles',
    cssDir: '.tmp/styles',
    imagesDir: 'images',
    javascriptsDir: '<%= yeoman.app %>/scripts',
    fontsDir: '<%= yeoman.app %>/styles/fonts',
    importPath: '<%= yeoman.app %>/components',
    relativeAssets: true
  },

如何配置 grunt 文件以删除前缀。

Answer 1

这是 Compass 任务的默认配置：https ://github.com/yeoman/generator-webapp/blob/master/app/templates/Gruntfile.js#L157

    compass: {
        options: {
            sassDir: '<%= yeoman.app %>/styles',
            cssDir: '.tmp/styles',
            generatedImagesDir: '.tmp/images/generated',
            imagesDir: '<%= yeoman.app %>/images',
            javascriptsDir: '<%= yeoman.app %>/scripts',
            fontsDir: '<%= yeoman.app %>/styles/fonts',
            importPath: '<%= yeoman.app %>/bower_components',
            httpImagesPath: '/images',
            httpGeneratedImagesPath: '/images/generated',
            httpFontsPath: '/styles/fonts',
            relativeAssets: false
        },
        dist: {
            options: {
                generatedImagesDir: '<%= yeoman.dist %>/images/generated'
            }
        },
        server: {
            options: {
                debugInfo: true
            }
        }
    }

也许尝试与此同步，看看它是否会自行解决。

Answer 2

Yeoman、Grunt 和 Compass 精灵为我工作：

    // The next line tells compass where to put the sprites
    // and the HTTP path to them.
    raw: 'http_images_path = "/images/"\ngenerated_images_dir = ".tmp/images"\nhttp_generated_images_path = "/images/"',
    // This doesn't work with relative paths.
    relativeAssets: false