index.js
3.7 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _postcss = require('postcss');
var _postcss2 = _interopRequireDefault(_postcss);
var _postcssValueParser = require('postcss-value-parser');
var _postcssValueParser2 = _interopRequireDefault(_postcssValueParser);
var _svgo = require('svgo');
var _svgo2 = _interopRequireDefault(_svgo);
var _isSvg = require('is-svg');
var _isSvg2 = _interopRequireDefault(_isSvg);
var _url = require('./lib/url');
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
const PLUGIN = 'postcss-svgo';
const dataURI = /data:image\/svg\+xml(;((charset=)?utf-8|base64))?,/i;
const dataURIBase64 = /data:image\/svg\+xml;base64,/i;
function minifyPromise(decl, getSvgo, opts) {
const promises = [];
const parsed = (0, _postcssValueParser2.default)(decl.value);
decl.value = parsed.walk(node => {
if (node.type !== 'function' || node.value.toLowerCase() !== 'url' || !node.nodes.length) {
return;
}
let { value, quote } = node.nodes[0];
let isBase64, isUriEncoded;
let svg = value.replace(dataURI, '');
if (dataURIBase64.test(value)) {
svg = Buffer.from(svg, 'base64').toString('utf8');
isBase64 = true;
} else {
let decodedUri;
try {
decodedUri = (0, _url.decode)(svg);
isUriEncoded = decodedUri !== svg;
} catch (e) {
// Swallow exception if we cannot decode the value
isUriEncoded = false;
}
if (isUriEncoded) {
svg = decodedUri;
}
if (opts.encode !== undefined) {
isUriEncoded = opts.encode;
}
}
if (!(0, _isSvg2.default)(svg)) {
return;
}
promises.push(getSvgo().optimize(svg).then(result => {
let data, optimizedValue;
if (isBase64) {
data = Buffer.from(result.data).toString('base64');
optimizedValue = 'data:image/svg+xml;base64,' + data;
} else {
data = isUriEncoded ? (0, _url.encode)(result.data) : result.data;
// Should always encode # otherwise we yield a broken SVG
// in Firefox (works in Chrome however). See this issue:
// https://github.com/cssnano/cssnano/issues/245
data = data.replace(/#/g, '%23');
optimizedValue = 'data:image/svg+xml;charset=utf-8,' + data;
quote = isUriEncoded ? '"' : '\'';
}
node.nodes[0] = Object.assign({}, node.nodes[0], {
value: optimizedValue,
quote: quote,
type: 'string',
before: '',
after: ''
});
}).catch(error => {
throw new Error(`${PLUGIN}: ${error}`);
}));
return false;
});
return Promise.all(promises).then(() => decl.value = decl.value.toString());
}
exports.default = _postcss2.default.plugin(PLUGIN, (opts = {}) => {
let svgo = null;
const getSvgo = () => {
if (!svgo) {
svgo = new _svgo2.default(opts);
}
return svgo;
};
return css => {
return new Promise((resolve, reject) => {
const svgoQueue = [];
css.walkDecls(decl => {
if (!dataURI.test(decl.value)) {
return;
}
svgoQueue.push(minifyPromise(decl, getSvgo, opts));
});
return Promise.all(svgoQueue).then(resolve, reject);
});
};
});
module.exports = exports['default'];