Грунт cssmin перебазирует относительный URI?

Question

В настоящее время я настраиваю grunt-usemin для нашего проекта, но у меня небольшая проблема с cssmin задача.

Наш проект зависит от нескольких внешних библиотек, некоторые из которых приносят много дополнительных ресурсов (таких как изображения или шрифты). Проблема в том, что эти библиотеки не имеют одинаковую структуру папок.

Это пример различных структур папок

lib
|--lib1
|   |--style1.css
|   +--image1.png
+--lib2
   |--styles
   |   +--style2.css
   +--images
       +--image2.png

В index.html на все таблицы стилей ссылаются и помещают в блок сборки. Таким образом, при выполнении задачи usemin таблицы стилей библиотек объединяются в один минимизированный файл и помещаются в выходную папку. Соответствующие активы (изображения) также копируются в эту выходную папку и помещаются в img папка. Структура выходной папки выглядит следующим образом

out
|--allstyles.min.css
|--image1.png
+--image2.png

Как вы можете догадаться, объединенные таблицы стилей имеют (в этом примере) два разных относительных URI:

• image1.png
• ..\images\image2.png

Это вызывает проблему, когда некоторые изображения не могут быть найдены. Мне нужно решение для перебазирования всех относительных URI в папку out. Я пытался использовать target а также root варианты cssmin Задача, но безрезультатно. Может ли кто-нибудь указать мне правильную конфигурацию этой задачи или другую задачу Grunt, которая может достичь того, что я ищу?

Заранее спасибо!

Answer 1

Посмотрите в документации / опциях cssmin:

• rebase: установите в false, чтобы пропустить перебазирование URL

Это решает проблему.

Answer 2

У меня есть ворчливый файл в C:\web\project и CSS файлы в C:\web\project\www\css, Следующий фрагмент взят из моего файла grunt, и он корректно перебазирует URL-адреса для меня.

var cssFiles = [
      'www/css/layout/Header.css',
      'www/css/layout/Footer.css',
      'www/css/vendor/chosen/chosen.css'
      // ...
];

cssmin: {
        concat: {
                options: {
                        keepBreaks: true, //  whether to keep line breaks (default is false)
                        debug: true, // set to true to get minification statistics under 'stats' property (see test/custom-test.js for examples)
                        noAdvanced: true, // set to true to disable advanced optimizations - selector & property merging, reduction, etc.
                        //relativeTo: 'http://online-domain-tools.com/'
                        noRebase: false, // whether to skip URLs rebasing
                        root: 'www'
                },
                nonull: true,
                src: cssFiles,
                dest: 'www/temp/application.css'
        },
        minify: {
                options: {},
                nonull: true,
                src: ['www/temp/application.css'],
                dest: 'www/temp/application.min.css'
        }
},

// ...

grunt.registerTask('default', ['cssmin:concat', 'cssmin:minify']);

Можете ли вы опубликовать свой grunt file, чтобы сравнить его?

Связанное чтение: /questions/21806901/usemin-i-perezapis-url-izobrazhenij-v-fajlah-css-postavschika-s-pomoschyu-grunt/21806908#21806908