Фоновый путь изображения в файлах CSS - Liferay 6.2

Question

Я работаю с проектом миграции Lifera. Проект был создан в Liferay 6.1, и теперь я перехожу к Liferay 6.2.

Я столкнулся с проблемой в пути изображения для всех файлов CSS. При миграции в Liferay 6.2 он добавляет путь к папке Тема и CSS ко всем изображениям.

путь изображения в Liferay 6.1:background:url(../../images/xyz.jpg)
путь изображения в Liferay 6.2:background:url(/myThemeName/css/../../images/xyz.jpg)

derectory Проект выглядит так:

_diffs 
    |- CSS 
     |- common 
     |- module1.css 
     |- module2.css 
     |- module3.css 
     |- library 
     |- plugin1.css 
     |- plugin2.css 
     |- plugin3.css 
     |- utility 
     |- tool1.css 
     |- tool2.css 
     |- tool3.css 
    |- images 
     |- All Images 
    |- js 
     |- JavaScript files 

Этот продукт огромен, и трудно обновить все фоновые URL-адреса.
Можно ли избавиться от «theme-name/css» из пути в файлах CSS.

Answer 1

Я бы предложил вам просто написать код, который откроет файл css -> read, а затем найдет свойство, которое соответствует -> background: url() и просто добавит URL-адрес/myThemeNames/css /.

Часть может быть написана на любом языке, php, python, java, C++. Все, что вам удобно. Даже если у вас есть 50 файлов css. Вы можете просто передать имена файлов в filestream, и он должен сделать это за вас.

Дайте мне знать, если вам нужна помощь в написании кода.

Answer 2

Проверьте это: https://github.com/philidem/rewrite-css-urls

перезаписи-CSS-URL'ами, то, что я использовал в прошлом, на больших участках (4000+ страниц), где я столкнулся с подобной проблемой. Следующий шаг должен вас через процесс:

Установка:npm install rewrite-css-urls --save

Использование:

Поиск:

require('rewrite-css-urls').find(cssCode, function(urlRef) { 
    console.log('Found URL: ' + urlRef.url); 
}); 

Найти & Заменить:

var transformedCssCode = require('rewrite-css-urls').findAndReplace(cssCode, { 
    replaceUrl: function(urlRef) { 
     return urlRef.url.replace('blah.com', 'mycompany.com'); 
    } 
}); 

Если Вам необходима дополнительная информация о его использовании и функции, проверить this post об этом на NPMJS.com

Я надеюсь, что это может помочь в решении вашей проблемы!