grunt-contrib-cssmin: относительный путь к изображениям не заменяется в целевом уменьшенном файле

Я использую grunt-contrib-cssmin для минимизации моих css -файлов. Я хочу, чтобы относительные URL-адреса в файлах CSS автоматически заменялись в моем целевом уменьшенном файле. Я искал эту проблему и нашел два варианта, которые я могу использовать, чтобы заменить URL,

цель, корень

Я думаю target это тот, который я должен использовать. Я попробовал это в моем следующем Gruntfile.js, но это не привело к уменьшенному файлу, который я хотел.

Ниже приводится Gruntfile.js

module.exports = function(grunt) {
// Project configuration.
grunt.initConfig({
  cssmin: {
    combine: {
      options: {
        target: "build/"
      },
      files: [{
        dest: 'build/app.min.css',
        src: "Modules/test/app.css"
      }]
    }
  }
});

grunt.loadNpmTasks('grunt-contrib-cssmin');

// Default task(s).
grunt.registerTask('default', ['cssmin']);
};

Он конвертирует следующие app.css -:

.edit {
  background: url(../../Main/img/edit.png);
}

к следующему app.min.css

.edit{background:url(../../Main/img/edit.png)}

Я хочу, чтобы URL-адрес минимизированного URL был примерно таким:

.edit{background:url(../Main/img/edit.png)}

Я думаю, что целевые параметры должны изменить относительный URL, но в моем случае это ничего не делает. Пожалуйста, дайте мне знать, что я делаю что-то не так.

Спасибо,

Sukhdeep

1 ответ

Решение

Я думаю, что вам нужно установить для rebase значение true и правильно указать пути. Я тоже боролся с этим, и это не было очевидно. После небольшого количества проб и ошибок я заставил это работать так.

    grunt.initConfig({
      cssmin: {
          options: {
              relativeTo: "./Main/img",
              target: "./build",
              rebase: true
          },
          combine: {
              files: [{
                  dest: 'build/precisionag.min.css',
                  src: "Modules/test/app.css"
              }]
          }
      }
    });

Более подробную информацию о различных опциях clean-css можно найти здесь. Clean-css.

Другие вопросы по тегам