如何用cssmin在最小化CSS中重写相对url

Question

我一直在寻找解决我的问题的方法，我发现了类似问题的帖子，但不一样。我的文件夹结构如下:

js
└── GUIFramework
    ├── external
    └── WaspFramework
        ├── Core
        └── GUI
            └── Controls
                └── WaspMask
                    ├── css
                    │   └── WaspMask.css
                    └── resources
                        └── default_loader_circle.gif

在WaspMask.css文件中，我有这样的规则:

。wasp-loader-default {背景图片:url(". ./资源/default_loader_circle.gif");}

嗯，我试着用cssmin插件最小化它(结合其他css文件)。我的gruntfile放在WaspFramework文件夹中，我想在那里生成最小化的css。gruntfile文件看起来像这样:

module.exports = function (grunt) {
    var _sources = grunt.file.readJSON('./sources.json');
    var _filesCSS = _sources.css;
    grunt.initConfig({
        cssmin: {
            wasp: {
                options: {
                    keepSpecialComments: 0
                },
                files: {
                    'wasp-bundle.min.css': _filesCSS
                }
            }
        }
    });
    // load plugins
    grunt.loadNpmTasks('grunt-contrib-cssmin');
    // register at least this one task
    grunt.registerTask('default', ['cssmin']);
};

在_filesCSS中，我有所有要缩小和合并的文件的路径，包括WaspMask.css。

我的问题是，cssmin的这个配置，wasp-loader-default类的url没有改变，所以，很明显，输出文件找不到图像。我试过改变cssmin选项，添加root属性:

options: {
    keepSpecialComments: 0,
    root: '.',
},

它将url更改为/GUI/Controls/WaspMask/resources/default_loader_circle.gif，但由于路径的第一个斜杠，它不起作用。我需要获得输出文件的相对路径(GUI/Controls/WaspMask/resources/default_loader_circle.gif应该可以)，因为我的应用程序是在虚拟目录下发布的。所以我不能使用从应用程序根目录开始的完整路径。我甚至尝试将其他值设置为root，但其中一些将url更改为完整路径，另一些将第一个斜杠添加到返回的路径。

你知道怎么解决这个问题吗?

Answer 1

在寻找解决我的问题的方法后，我发现了我在'cssmin'插件问题中需要的属性:https://github.com/gruntjs/grunt-contrib-cssmin/pull/47

虽然我发现了一个小问题，而我是压缩'bootstrap.css'文件在我的供应商的捆绑文件。这个问题和一个可能的解决方案(基本上，在任务的选项中设置"noAdvanced"属性为true)在我昨天做的帖子中有深入的解释:https://github.com/gruntjs/grunt-contrib-cssmin/issues/103

编辑:

这是我的grunt文件:

module.exports = function (grunt) {
    var conf = grunt.file.readJSON('sources.json');
    grunt.initConfig({
        cssmin: {
            options: {
                keepSpecialComments: 0,
                target: 'commonDir',
                noAdvanced: true
            },
            test: {
                files: {
                    'test.min.css': conf.css
                }
            }
        }
    });
    // load plugins
    grunt.loadNpmTasks('grunt-contrib-cssmin');
    // register at least this one task
    grunt.registerTask('default', ['cssmin']);
};

target属性是所有要缩小的文件的公共物理目录(我通过包含其路径的json文件加载这些文件)。

noAdvanced属性是我用来避免我用bootstrap.css解释的问题的选项，尽管在@XhmikosR发布在https://github.com/gruntjs/grunt-contrib-cssmin/issues/103的最后评论中，他说有一个补丁可以修复它。