113 lines
3.1 KiB
JavaScript
113 lines
3.1 KiB
JavaScript
|
"use strict";
|
||
|
|
|
||
|
|
Object.defineProperty(exports, "__esModule", {
|
||
|
|
value: true
|
||
|
|
});
|
||
|
|
exports.default = removeUnusedCss;
|
||
|
|
var _helpers = require("../helpers.cjs");
|
||
|
|
// These options must be set and shouldn't be overriden to ensure uncss doesn't look at linked stylesheets.
|
||
|
|
const uncssOptions = {
|
||
|
|
ignoreSheets: [/\s*/],
|
||
|
|
stylesheets: []
|
||
|
|
};
|
||
|
|
function processStyleNodeUnCSS(html, styleNode, uncssOptions, uncss) {
|
||
|
|
const css = (0, _helpers.extractCssFromStyleNode)(styleNode);
|
||
|
|
return runUncss(html, css, uncssOptions, uncss).then(css => {
|
||
|
|
// uncss may have left some style tags empty
|
||
|
|
if (css.trim().length === 0) {
|
||
|
|
styleNode.tag = false;
|
||
|
|
styleNode.content = [];
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
styleNode.content = [css];
|
||
|
|
});
|
||
|
|
}
|
||
|
|
function runUncss(html, css, userOptions, uncss) {
|
||
|
|
if (typeof userOptions !== 'object') {
|
||
|
|
userOptions = {};
|
||
|
|
}
|
||
|
|
const options = {
|
||
|
|
...userOptions,
|
||
|
|
...uncssOptions
|
||
|
|
};
|
||
|
|
return new Promise((resolve, reject) => {
|
||
|
|
options.raw = css;
|
||
|
|
uncss(html, options, (error, output) => {
|
||
|
|
if (error) {
|
||
|
|
reject(error);
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
resolve(output);
|
||
|
|
});
|
||
|
|
});
|
||
|
|
}
|
||
|
|
const purgeFromHtml = function (tree) {
|
||
|
|
// content is not used as we can directly used the parsed HTML,
|
||
|
|
// making the process faster
|
||
|
|
const selectors = [];
|
||
|
|
tree.walk(node => {
|
||
|
|
const classes = node.attrs && node.attrs.class && node.attrs.class.split(' ') || [];
|
||
|
|
const ids = node.attrs && node.attrs.id && node.attrs.id.split(' ') || [];
|
||
|
|
selectors.push(...classes, ...ids);
|
||
|
|
node.tag && selectors.push(node.tag);
|
||
|
|
return node;
|
||
|
|
});
|
||
|
|
return () => selectors;
|
||
|
|
};
|
||
|
|
function processStyleNodePurgeCSS(tree, styleNode, purgecssOptions, purgecss) {
|
||
|
|
const css = (0, _helpers.extractCssFromStyleNode)(styleNode);
|
||
|
|
return runPurgecss(tree, css, purgecssOptions, purgecss).then(css => {
|
||
|
|
if (css.trim().length === 0) {
|
||
|
|
styleNode.tag = false;
|
||
|
|
styleNode.content = [];
|
||
|
|
return;
|
||
|
|
}
|
||
|
|
styleNode.content = [css];
|
||
|
|
});
|
||
|
|
}
|
||
|
|
function runPurgecss(tree, css, userOptions, purgecss) {
|
||
|
|
if (typeof userOptions !== 'object') {
|
||
|
|
userOptions = {};
|
||
|
|
}
|
||
|
|
const options = {
|
||
|
|
...userOptions,
|
||
|
|
content: [{
|
||
|
|
raw: tree,
|
||
|
|
extension: 'html'
|
||
|
|
}],
|
||
|
|
css: [{
|
||
|
|
raw: css,
|
||
|
|
extension: 'css'
|
||
|
|
}],
|
||
|
|
extractors: [{
|
||
|
|
extractor: purgeFromHtml(tree),
|
||
|
|
extensions: ['html']
|
||
|
|
}]
|
||
|
|
};
|
||
|
|
return new purgecss.PurgeCSS().purge(options).then(result => {
|
||
|
|
return result[0].css;
|
||
|
|
});
|
||
|
|
}
|
||
|
|
|
||
|
|
/** Remove unused CSS */
|
||
|
|
async function removeUnusedCss(tree, options, userOptions) {
|
||
|
|
const promises = [];
|
||
|
|
const html = userOptions.tool !== 'purgeCSS' && tree.render(tree);
|
||
|
|
const purgecss = await (0, _helpers.optionalImport)('purgecss');
|
||
|
|
const uncss = await (0, _helpers.optionalImport)('uncss');
|
||
|
|
tree.walk(node => {
|
||
|
|
if ((0, _helpers.isStyleNode)(node)) {
|
||
|
|
if (userOptions.tool === 'purgeCSS') {
|
||
|
|
if (purgecss) {
|
||
|
|
promises.push(processStyleNodePurgeCSS(tree, node, userOptions, purgecss));
|
||
|
|
}
|
||
|
|
} else {
|
||
|
|
if (uncss) {
|
||
|
|
promises.push(processStyleNodeUnCSS(html, node, userOptions, uncss));
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
return node;
|
||
|
|
});
|
||
|
|
return Promise.all(promises).then(() => tree);
|
||
|
|
}
|