मैं इसे ग्रंट कार्य के साथ करता हूं। "ग्रंट-टेक्स्ट-रिप्लेसमेंट" का उपयोग करके मैं एक कस्टम रेगुलर एक्सप्रेशन के माध्यम से अपने मिनीवेटेड SVG (svgmin) को पास करने में सक्षम हूं जो सभी गार्बल्ड क्लास रेफरेंस को उचित कक्षाओं के साथ बदल देता है।
इलस्ट्रेटर में, क्लास के लिए लेयर / ऑब्जेक्ट नाम घोषित करें = उदाहरण के लिए "ट्री" । यह Illustrator द्वारा id = "class =" tree "" के रूप में निर्यात किया जाएगा । नीचे दिए गए ग्रंट कार्य को ध्यान में रखा जाएगा और इसे कक्षा = "पेड़" बनाया जाएगा । मैं कुछ अन्य उप-प्रकारों के नीचे भी चिपका रहा हूं जो एक आईडी क्लीनअप (अनुशंसित) करेंगे।
replace: {
// ID cleanup: performs a manual ID cleanup as Illustrator exports a mess
illustrator: {
src: ['assets/svg/optimised/*.svg'],
overwrite: true,
replacements: [{
// Remove escaped underscore character
from: '_x5F_',
to: '_'
}, {
// Replace class names with proper classes
//class_x3D__x22_tank-option_x22__2_
from: /id\=\"class_x3D__x22_(.+?)_x22_(.*?)\"/gi,
to: function(matchedWord, index, fullText, regexMatches) {
return 'class="'+ regexMatches[0].toLowerCase()+'"';
}
}, {
// Lowercase all ids
from: /id\=\"(.+?)\"/gi,
to: function(matchedWord, index, fullText, regexMatches) {
return 'id="'+ regexMatches[0].toLowerCase()+'"';
}
}, {
// Lowercase all id references to match the previous replace rule
from: /url\(\#(.+?)\)/gi,
to: function(matchedWord, index, fullText, regexMatches) {
return 'url(#'+ regexMatches[0].toLowerCase() +')';
}
}, {
// Lowercase all id href to match the previous replace rule
from: /href\=\"\#(.+?)\"/gi,
to: function(matchedWord, index, fullText, regexMatches) {
return 'href="#'+ regexMatches[0].toLowerCase() +'"';
}
}, {
// Remove all font references as we will use CSS for this
from: /font\-family\=\"(.+?)\"/gi,
to: function(matchedWord, index, fullText, regexMatches) {
return '';
}
}]
}
}
तब आप इस कार्य को अपने गंटफाइल के भीतर कह सकते हैं:
grunt.registerTask('svgclean', [
'replace:illustrator'
]);
