@gafreax/cssparser
Advanced tools
Comparing version 1.0.1 to 1.0.2
"use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.stringify = exports.compact = exports.tokenize = exports.isSkippable = exports.isWhitespace = void 0; | ||
const mediaQuery_1 = require("./mediaQuery"); | ||
const isWhitespace = function (char) { return char === ' ' || char === '\t' || char === '\n'; }; | ||
exports.isWhitespace = isWhitespace; | ||
exports.stringify = exports.compact = void 0; | ||
const tokenize_1 = require("./tokenize"); | ||
/** | ||
* Check if char is skippable because its value does mean nothing in css | ||
* This is useful for optimization purposes | ||
* @param {string} char current char | ||
* @param {string} oldChar old char to compare | ||
* @returns if the current char is skippable | ||
* Compact the tokens | ||
* @param Tokens that will be compacted | ||
* @returns compacted Tokens | ||
*/ | ||
const isSkippable = function (char, oldChar) { | ||
const witheSpace = ((0, exports.isWhitespace)(oldChar) && (0, exports.isWhitespace)(char)) || char === '\n'; | ||
const afterPunctuation = (oldChar === ';' || oldChar === ':') && (0, exports.isWhitespace)(char); | ||
return witheSpace || afterPunctuation; | ||
}; | ||
exports.isSkippable = isSkippable; | ||
/** | ||
* Simple function to tokenize css string into tokens object | ||
* Tokens object is used to optimize css string by removing redundant css rules. | ||
* Redundant css rules are rules that have the same css value as another rule. | ||
* For example: | ||
* .class { color: red; } | ||
* .class { background: blue; } | ||
* | ||
* Become: | ||
* | ||
* {'.class': 'color: red; background: blue;' } | ||
* | ||
* @param css String with css style | ||
* @returns Tokens with identification tokens and its style rules | ||
*/ | ||
const tokenize = function (css) { | ||
const tokens = {}; | ||
const mediaQueries = (0, mediaQuery_1.getMediaQueries)(css); | ||
let ruleId = ''; | ||
let ruleValue = ''; | ||
let isValueToken = false; | ||
let oldChar = ''; | ||
let mediaQueryParsed = 0; | ||
for (let index = 0; index < css.length; index++) { | ||
const char = css[index]; | ||
// optimization | ||
if (oldChar === '/' && char === '*') { | ||
index = css.indexOf('*/', index) + 2; | ||
} | ||
if (index >= mediaQueries[mediaQueryParsed]?.start) { | ||
index = mediaQueries[mediaQueryParsed].end + 1; | ||
mediaQueryParsed++; | ||
continue; | ||
} | ||
if ((0, exports.isSkippable)(char, oldChar)) { | ||
continue; | ||
} | ||
// tokenization | ||
if (char === '}') { | ||
ruleId = ruleId.trim(); | ||
ruleValue = ruleValue.trim(); | ||
if (oldChar === ';') { | ||
ruleValue = ruleValue.slice(0, -1); | ||
} | ||
const rule = tokens[ruleId]; | ||
if (rule === undefined) { | ||
tokens[ruleId] = ruleValue; | ||
} | ||
else { | ||
// size output optimization | ||
const lastRuleChar = rule[rule.length]; | ||
const joinedRule = lastRuleChar === ';' ? rule + ruleValue : rule + ';' + ruleValue; | ||
tokens[ruleId] = joinedRule; | ||
} | ||
ruleId = ''; | ||
ruleValue = ''; | ||
isValueToken = false; | ||
} | ||
else if (char === '{') { | ||
isValueToken = true; | ||
} | ||
else if (isValueToken) { | ||
ruleValue += char; | ||
} | ||
else { | ||
ruleId += char; | ||
} | ||
oldChar = char; | ||
} | ||
const mediaTokens = {}; | ||
for (const mediaQuery of mediaQueries) { | ||
const mediaQueryStart = mediaQuery.start; | ||
const mediaQueryEnd = mediaQuery.end; | ||
const mediaQueryFirstParenthesis = css.indexOf('{', mediaQueryStart); | ||
const rule = css.slice(mediaQueryStart, mediaQueryFirstParenthesis); | ||
const value = css.slice(mediaQueryFirstParenthesis + 1, mediaQueryEnd - 1); | ||
mediaTokens[rule] = value.replaceAll('\n', '').replaceAll('\t', '').replaceAll(' ', ''); | ||
} | ||
return { ...tokens, ...mediaTokens }; | ||
}; | ||
exports.tokenize = tokenize; | ||
const compact = function (tokens) { | ||
@@ -141,3 +50,3 @@ for (const token in tokens) { | ||
exports.stringify = stringify; | ||
const cleancss = (css) => (0, exports.stringify)((0, exports.compact)((0, exports.tokenize)(css))); | ||
const cleancss = (css) => (0, exports.stringify)((0, exports.compact)((0, tokenize_1.tokenize)(css))); | ||
exports.default = cleancss; |
@@ -11,3 +11,3 @@ "use strict"; | ||
// todo: remove empty rules | ||
const css = 'a{font-weight:bold; background-color: #aaff00; color: #ffaa00; border: 0px;} p{};'; | ||
// const css = 'a{font-weight:bold; /* comment */ background-color: #aaff00; color: #ffaa00; border: 0px;} p{};' | ||
// const _css = ` | ||
@@ -182,2 +182,182 @@ // body { | ||
// const css_new = 'body {\n margin: 0;\n padding: 0;\n -webkit-text-size-adjust: none;\n text-size-adjust: none;\n background-color: #fff1ff;\n}\n\n.nl-container {\n background-color: #fff1ff;\n}\n\ntable, .column {\n mso-table-lspace: 0pt;\n mso-table-rspace: 0pt;\n}\n\n.column {\n font-weight: 400;\n text-align: left;\n vertical-align: top;\n}\n\np {\n margin: 0;\n}\n\nimg {\n display: block;\n height: auto;\n}\n\n.desktop_hide,\n.desktop_hide table {\n mso-hide: all;\n display: none;\n max-height: 0px;\n overflow: hidden;\n}.divider_inner {\n font-size: 1px;\n line-height: 1px;\n}.icons_block td {\n vertical-align: middle;\n}\n.icons_block td img {\n border: 0;\n margin: 0 auto;\n}\n.icons_block td a {\n text-decoration: none;\n}\n\n@media (max-width: 670px) {\n .desktop_hide table.icons-inner {\n display: inline-block !important;\n }\n .icons-inner {\n text-align: center;\n }\n .icons-inner td {\n margin: 0 auto;\n }\n}@media (max-width: 670px) {\n .image_block img.fullWidth {\n max-width: 100% !important;\n }\n}\n.image_block img {\n border: 0;\n}.menu_block.desktop_hide .menu-links span {\n mso-hide: all;\n}\n\n@media (max-width: 670px) {\n .menu-checkbox[type=checkbox] ~ .menu-links {\n display: none !important;\n padding: 5px 0;\n }\n .menu-checkbox[type=checkbox] ~ .menu-links span.sep {\n display: none !important;\n }\n .menu-checkbox[type=checkbox]:checked ~ .menu-links,\n .menu-checkbox[type=checkbox] ~ .menu-trigger {\n display: block !important;\n max-width: none !important;\n max-height: none !important;\n font-size: inherit !important;\n }\n .menu-checkbox[type=checkbox] ~ .menu-links > a,\n .menu-checkbox[type=checkbox] ~ .menu-links > span.label {\n display: block !important;\n text-align: center;\n }\n .menu-checkbox[type=checkbox]:checked ~ .menu-trigger .menu-close {\n display: block !important;\n }\n .menu-checkbox[type=checkbox]:checked ~ .menu-trigger .menu-open {\n display: none !important;\n }\n .menu-specific {\n display: none;\n }\n}.social-table img {\n border: 0;\n}\n\n@media (max-width: 670px) {\n .social_block.desktop_hide .social-table {\n display: inline-block !important;\n }\n}.text_block {\n word-break: break-word;\n}@media (max-width: 670px) {\n .video_block .sizer {\n max-width: none !important;\n }\n}\n.video_block * {\n box-sizing: content-box;\n}h1, h2, h3 {\n margin: 0;\n}.paragraph_block {\n word-break: break-word;\n}.list_block {\n word-break: break-word;\n}\n.list_block ul, .list_block ol {\n margin-top: 0;\n margin-bottom: 0;\n padding: 0;\n}\n.list_block ul.leftList, .list_block ol.leftList {\n padding-left: 20px;\n}@media (max-width: 670px) {\n /* TODO: check if .row is removable */\n /*\n .row {\n \twidth: 100%;\n \theight: auto;\n }\n */\n .row .side {\n display: none;\n }\n .row-content {\n width: 100% !important;\n }\n .stack .column {\n width: 100%;\n display: block;\n }\n .mobile_hide {\n min-height: 0px;\n max-height: 0px;\n max-width: 0px;\n display: none;\n overflow: hidden;\n font-size: 0px;\n }\n .desktop_hide,\n .desktop_hide table {\n display: table !important;\n max-height: none !important;\n }\n .reverse {\n display: table;\n width: 100%;\n }\n .reverse .column.first {\n display: table-footer-group !important;\n }\n .reverse .column.last {\n display: table-header-group !important;\n }\n}.row-1{background-color: #ffffff;}.row-1 .row-content{background-color: #ffffff;color: #000000;}.row-1 .col-1 {padding-bottom: 10px;padding-top: 10px;vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-1 .col-1 .block-1{}.row-2{background-color: #ffffff;}.row-2 .row-content{background-color: #bf8c41;color: #000000;}.row-2 .col-1 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-2 .col-1 .block-1{width: 100%;}.row-3{background-color: #ffffff;}.row-3 .row-content{background-color: #FFFFFF;color: #000000;}.row-3 .col-1 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-3 .col-1 .block-1{width: 100%;}.row-4{}.row-4 .row-content{background-color: #ffffff;color: #000000;}.row-4 .col-1 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-4 .col-1 .block-1{width: 100%;}.row-4 .col-2 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-4 .col-2 .block-1{width: 100%;}.row-4 .col-3 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-4 .col-3 .block-1{width: 100%;}.row-4 .col-4 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-4 .col-4 .block-1{width: 100%;}.row-5{background-color: #ffffff;}.row-5 .row-content{background-color: #f9f7ea;color: #000000;}.row-5 .col-1 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-5 .col-1 .block-1{width: 100%;}.row-5 .col-1 .block-2{width: 100%;}.row-6{background-color: #ffffff;}.row-6 .row-content{background-color: #f3dfdb;color: #000000;}.row-6 .col-1 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-6 .col-1 .block-1{width: 100%;}.row-7{background-color: #ffffff;}.row-7 .row-content{background-color: #f3dfdb;color: #000000;}.row-7 .col-1 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-7 .col-1 .block-1{}.row-8{background-color: #ffffff;}.row-8 .row-content{background-color: #f3dfdb;color: #000000;}.row-8 .col-1 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-8 .col-1 .block-1{width: 100%;}.row-9{background-color: #ffffff;}.row-9 .row-content{background-color: #ffffff;color: #000000;}.row-9 .col-1 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-9 .col-1 .block-1{width: 100%;}.row-10{background-color: #ffffff;}.row-10 .row-content{background-color: #ffffff;color: #000000;}.row-10 .col-1 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-10 .col-1 .block-1{width: 100%;}.row-10 .col-2 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-10 .col-2 .block-1{width: 100%;}.row-11{}.row-11 .row-content{background-color: #ffffff;color: #000000;}.row-11 .col-1 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-11 .col-1 .block-1{width: 100%;}.row-12{background-color: #ffffff;}.row-12 .row-content{background-color: #e2e4e9;color: #000000;}.row-12 .col-1 {padding-bottom: 10px;padding-top: 22px;vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-12 .col-1 .block-1{width: 100%;}.row-13{background-color: #ffffff;}.row-13 .row-content{background-color: #e2e4e9;color: #000000;}.row-13 .col-1 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-13 .col-2 {padding-bottom: 5px;vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-13 .col-2 .block-1{color: #000000;font-family: inherit;font-size: 14px;text-align: center;}.row-13 .col-3 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-14{background-color: #ffffff;}.row-14 .row-content{background-color: #e2e4e9;color: #000000;}.row-14 .col-1 {padding-bottom: 30px;padding-left: 15px;padding-right: 15px;padding-top: 20px;vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-14 .col-1 .block-1{}' | ||
const css = ` | ||
'body { | ||
margin: 0; | ||
padding: 0; | ||
-webkit-text-size-adjust: none; | ||
text-size-adjust: none; | ||
background-color: #fff1ff; | ||
} | ||
.nl-container { | ||
background-color: #fff1ff; | ||
} | ||
table, .column { | ||
mso-table-lspace: 0pt; | ||
mso-table-rspace: 0pt; | ||
} | ||
.column { | ||
font-weight: 400; | ||
text-align: left; | ||
vertical-align: top; | ||
} | ||
p { | ||
margin: 0; | ||
} | ||
img { | ||
display: block; | ||
height: auto; | ||
} | ||
.desktop_hide, | ||
.desktop_hide table { | ||
mso-hide: all; | ||
display: none; | ||
max-height: 0px; | ||
overflow: hidden; | ||
}.divider_inner { | ||
font-size: 1px; | ||
line-height: 1px; | ||
}.icons_block td { | ||
vertical-align: middle; | ||
} | ||
.icons_block td img { | ||
border: 0; | ||
margin: 0 auto; | ||
} | ||
.icons_block td a { | ||
text-decoration: none; | ||
} | ||
@media (max-width: 670px) { | ||
.desktop_hide table.icons-inner { | ||
display: inline-block !important; | ||
} | ||
.icons-inner { | ||
text-align: center; | ||
} | ||
.icons-inner td { | ||
margin: 0 auto; | ||
} | ||
}@media (max-width: 670px) { | ||
.image_block img.fullWidth { | ||
max-width: 100% !important; | ||
} | ||
} | ||
.image_block img { | ||
border: 0; | ||
}.menu_block.desktop_hide .menu-links span { | ||
mso-hide: all; | ||
} | ||
@media (max-width: 670px) { | ||
.menu-checkbox[type=checkbox] ~ .menu-links { | ||
display: none !important; | ||
padding: 5px 0; | ||
} | ||
.menu-checkbox[type=checkbox] ~ .menu-links span.sep { | ||
display: none !important; | ||
} | ||
.menu-checkbox[type=checkbox]:checked ~ .menu-links, | ||
.menu-checkbox[type=checkbox] ~ .menu-trigger { | ||
display: block !important; | ||
max-width: none !important; | ||
max-height: none !important; | ||
font-size: inherit !important; | ||
} | ||
.menu-checkbox[type=checkbox] ~ .menu-links > a, | ||
.menu-checkbox[type=checkbox] ~ .menu-links > span.label { | ||
display: block !important; | ||
text-align: center; | ||
} | ||
.menu-checkbox[type=checkbox]:checked ~ .menu-trigger .menu-close { | ||
display: block !important; | ||
} | ||
.menu-checkbox[type=checkbox]:checked ~ .menu-trigger .menu-open { | ||
display: none !important; | ||
} | ||
.menu-specific { | ||
display: none; | ||
} | ||
}.social-table img { | ||
border: 0; | ||
} | ||
@media (max-width: 670px) { | ||
.social_block.desktop_hide .social-table { | ||
display: inline-block !important; | ||
} | ||
}.text_block { | ||
word-break: break-word; | ||
}@media (max-width: 670px) { | ||
.video_block .sizer { | ||
max-width: none !important; | ||
} | ||
} | ||
.video_block * { | ||
box-sizing: content-box; | ||
}h1, h2, h3 { | ||
margin: 0; | ||
}.paragraph_block { | ||
word-break: break-word; | ||
}.list_block { | ||
word-break: break-word; | ||
} | ||
.list_block ul { | ||
list-style-position: inside; | ||
} | ||
.list_block ul, .list_block ol { | ||
margin-top: 0; | ||
margin-bottom: 0; | ||
padding: 0; | ||
} | ||
.list_block ul.leftList, .list_block ol.leftList { | ||
padding-left: 20px; | ||
}@media (max-width: 670px) { | ||
/* TODO: check if .row is removable */ | ||
/* | ||
.row { | ||
width: 100%; | ||
height: auto; | ||
} | ||
*/ | ||
.row .side { | ||
display: none; | ||
} | ||
.row-content { | ||
width: 100% !important; | ||
} | ||
.stack .column { | ||
width: 100%; | ||
display: block; | ||
} | ||
.mobile_hide { | ||
min-height: 0px; | ||
max-height: 0px; | ||
max-width: 0px; | ||
display: none; | ||
overflow: hidden; | ||
font-size: 0px; | ||
} | ||
.desktop_hide, | ||
.desktop_hide table { | ||
display: table !important; | ||
max-height: none !important; | ||
} | ||
.reverse { | ||
display: table; | ||
width: 100%; | ||
} | ||
.reverse .column.first { | ||
display: table-footer-group !important; | ||
} | ||
.reverse .column.last { | ||
display: table-header-group !important; | ||
} | ||
}.row-1{background-color: #ffffff;}.row-1 .row-content{background-color: #ffffff;color: #000000;}.row-1 .col-1 {padding-bottom: 10px;padding-top: 10px;vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-1 .col-1 .block-1{}.row-2{background-color: #ffffff;}.row-2 .row-content{background-color: #bf8c41;color: #000000;}.row-2 .col-1 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-2 .col-1 .block-1{width: 100%;}.row-3{background-color: #ffffff;}.row-3 .row-content{background-color: #FFFFFF;color: #000000;}.row-3 .col-1 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-3 .col-1 .block-1{width: 100%;}.row-4{}.row-4 .row-content{background-color: #ffffff;color: #000000;}.row-4 .col-1 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-4 .col-1 .block-1{width: 100%;}.row-4 .col-2 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-4 .col-2 .block-1{width: 100%;}.row-4 .col-3 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-4 .col-3 .block-1{width: 100%;}.row-4 .col-4 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-4 .col-4 .block-1{width: 100%;}.row-5{background-color: #ffffff;}.row-5 .row-content{background-color: #f9f7ea;color: #000000;}.row-5 .col-1 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-5 .col-1 .block-1{width: 100%;}.row-5 .col-1 .block-2{width: 100%;}.row-6{background-color: #ffffff;}.row-6 .row-content{background-color: #f3dfdb;color: #000000;}.row-6 .col-1 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-6 .col-1 .block-1{width: 100%;}.row-7{background-color: #ffffff;}.row-7 .row-content{background-color: #f3dfdb;color: #000000;}.row-7 .col-1 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-7 .col-1 .block-1{}.row-8{background-color: #ffffff;}.row-8 .row-content{background-color: #f3dfdb;color: #000000;}.row-8 .col-1 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-8 .col-1 .block-1{width: 100%;}.row-9{background-color: #ffffff;}.row-9 .row-content{background-color: #ffffff;color: #000000;}.row-9 .col-1 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-9 .col-1 .block-1{width: 100%;}.row-10{background-color: #ffffff;}.row-10 .row-content{background-color: #ffffff;color: #000000;}.row-10 .col-1 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-10 .col-1 .block-1{width: 100%;}.row-10 .col-2 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-10 .col-2 .block-1{width: 100%;}.row-11{}.row-11 .row-content{background-color: #ffffff;color: #000000;}.row-11 .col-1 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-11 .col-1 .block-1{width: 100%;}.row-12{background-color: #ffffff;}.row-12 .row-content{background-color: #e2e4e9;color: #000000;}.row-12 .col-1 {padding-bottom: 10px;padding-top: 22px;vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-12 .col-1 .block-1{width: 100%;}.row-13{background-color: #ffffff;}.row-13 .row-content{background-color: #e2e4e9;color: #000000;}.row-13 .col-1 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-13 .col-2 {padding-bottom: 5px;vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-13 .col-2 .block-1{color: #000000;font-family: inherit;font-size: 14px;text-align: center;}.row-13 .col-3 {vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-14{background-color: #ffffff;}.row-14 .row-content{background-color: #e2e4e9;color: #000000;}.row-14 .col-1 {padding-bottom: 30px;padding-left: 15px;padding-right: 15px;padding-top: 20px;vertical-align: top;border-top: 0px;border-right: 0px;border-bottom: 0px;border-left: 0px;}.row-14 .col-1 .block-1{}' | ||
`; | ||
console.log('css ', css); | ||
@@ -184,0 +364,0 @@ const perf = []; |
"use strict"; | ||
Object.defineProperty(exports, "__esModule", { value: true }); | ||
exports.findIndexOfMediaQueries = exports.getMediaQueries = void 0; | ||
exports.getMediaQueries = exports.findIndexOfMediaQueries = void 0; | ||
const findIndexOfMediaQueries = (css) => { | ||
const indexList = []; | ||
const len = '@media'.length; | ||
let currentIndex = css.indexOf('@media'); | ||
while (currentIndex >= 0) { | ||
indexList.push(currentIndex); | ||
currentIndex = css.indexOf('@media', currentIndex + len); | ||
} | ||
return indexList; | ||
}; | ||
exports.findIndexOfMediaQueries = findIndexOfMediaQueries; | ||
const getMediaQueries = (css) => { | ||
@@ -15,9 +26,14 @@ const indexList = (0, exports.findIndexOfMediaQueries)(css); | ||
for (i; deep > 0 && i <= css.length; i++) { | ||
if (css[i] === '{') { | ||
deep++; | ||
if (css[i] === '/' && css[i + 1] === '*') { | ||
continue; | ||
} | ||
else if (css[i] === '}') { | ||
deep--; | ||
else { | ||
if (css[i] === '{') { | ||
deep++; | ||
} | ||
else if (css[i] === '}') { | ||
deep--; | ||
} | ||
val += css[i]; | ||
} | ||
val += css[i]; | ||
} | ||
@@ -30,12 +46,1 @@ mediaQueries.push({ rule, val, start: index, end: i }); | ||
exports.getMediaQueries = getMediaQueries; | ||
const findIndexOfMediaQueries = (css) => { | ||
const indexList = []; | ||
const len = '@media'.length; | ||
let currentIndex = css.indexOf('@media'); | ||
while (currentIndex >= 0) { | ||
indexList.push(currentIndex); | ||
currentIndex = css.indexOf('@media', currentIndex + len); | ||
} | ||
return indexList; | ||
}; | ||
exports.findIndexOfMediaQueries = findIndexOfMediaQueries; |
{ | ||
"name": "@gafreax/cssparser", | ||
"version": "1.0.1", | ||
"version": "1.0.2", | ||
"description": "Simple CSS Parser to tokenize CSS, merge rules, and optimize it", | ||
@@ -5,0 +5,0 @@ "main": "dist/src/index.js", |
# CSS Parser | ||
This package provides a powerful and efficient TypeScript library for parsing and optimizing CSS strings. It enables developers to easily extract, manipulate, and transform CSS code within JavaScript projects. | ||
This package provides a powerful and efficient TypeScript library for optimizing CSS strings. It enables developers to easily compress css JavaScript projects. | ||
The great focus is on keeping a great compatibility across all kind of render engine especially on the various Outlook. | ||
## Features | ||
* **Optimize CSS code:** Remove redundant or unnecessary CSS rules to reduce file size and improve performance. | ||
* **Group rules:** Group same rules with one selector. | ||
* **Compress:** Compress the size by removing not necessary char. | ||
* **Merge selector:** Merge same selector into only one. | ||
* **Media Query:** Move all media queries at the bottom. | ||
@@ -12,3 +17,3 @@ | ||
```bash | ||
npm install gafreax/cssparse | ||
npm install @gafreax/cssparse | ||
``` | ||
@@ -43,2 +48,2 @@ | ||
We welcome contributions to this open-source project. If you encounter issues or have suggestions for improvement, please feel free to create GitHub issues or submit pull requests. | ||
We welcome contributions to this open-source project. If you encounter issues or have suggestions for improvement, please feel free to create GitHub issues or submit pull requests. |
{ | ||
"compilerOptions": { | ||
/* Visit https://aka.ms/tsconfig to read more about this file */ | ||
/* Projects */ | ||
// "incremental": true, /* Save .tsbuildinfo files to allow for incremental compilation of projects. */ | ||
// "composite": true, /* Enable constraints that allow a TypeScript project to be used with project references. */ | ||
// "tsBuildInfoFile": "./.tsbuildinfo", /* Specify the path to .tsbuildinfo incremental compilation file. */ | ||
// "disableSourceOfProjectReferenceRedirect": true, /* Disable preferring source files instead of declaration files when referencing composite projects. */ | ||
// "disableSolutionSearching": true, /* Opt a project out of multi-project reference checking when editing. */ | ||
// "disableReferencedProjectLoad": true, /* Reduce the number of projects loaded automatically by TypeScript. */ | ||
/* Language and Environment */ | ||
"target": "ES2022", /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */ | ||
// "lib": [], /* Specify a set of bundled library declaration files that describe the target runtime environment. */ | ||
// "jsx": "preserve", /* Specify what JSX code is generated. */ | ||
// "experimentalDecorators": true, /* Enable experimental support for legacy experimental decorators. */ | ||
// "emitDecoratorMetadata": true, /* Emit design-type metadata for decorated declarations in source files. */ | ||
// "jsxFactory": "", /* Specify the JSX factory function used when targeting React JSX emit, e.g. 'React.createElement' or 'h'. */ | ||
// "jsxFragmentFactory": "", /* Specify the JSX Fragment reference used for fragments when targeting React JSX emit e.g. 'React.Fragment' or 'Fragment'. */ | ||
// "jsxImportSource": "", /* Specify module specifier used to import the JSX factory functions when using 'jsx: react-jsx*'. */ | ||
// "reactNamespace": "", /* Specify the object invoked for 'createElement'. This only applies when targeting 'react' JSX emit. */ | ||
// "noLib": true, /* Disable including any library files, including the default lib.d.ts. */ | ||
// "useDefineForClassFields": true, /* Emit ECMAScript-standard-compliant class fields. */ | ||
// "moduleDetection": "auto", /* Control what method is used to detect module-format JS files. */ | ||
/* Modules */ | ||
"module": "CommonJS", /* Specify what module code is generated. */ | ||
"rootDir": "./", /* Specify the root folder within your source files. */ | ||
// "moduleResolution": "NodeNext", /* Specify how TypeScript looks up a file from a given module specifier. */ | ||
// "baseUrl": "./", /* Specify the base directory to resolve non-relative module names. */ | ||
// "paths": {}, /* Specify a set of entries that re-map imports to additional lookup locations. */ | ||
// "rootDirs": [], /* Allow multiple folders to be treated as one when resolving modules. */ | ||
// "typeRoots": [], /* Specify multiple folders that act like './node_modules/@types'. */ | ||
"types": [ "node", "jest"], /* Specify type package names to be included without being referenced in a source file. */ | ||
// "allowUmdGlobalAccess": true, /* Allow accessing UMD globals from modules. */ | ||
// "moduleSuffixes": [], /* List of file name suffixes to search when resolving a module. */ | ||
// "allowImportingTsExtensions": true, /* Allow imports to include TypeScript file extensions. Requires '--moduleResolution bundler' and either '--noEmit' or '--emitDeclarationOnly' to be set. */ | ||
// "resolvePackageJsonExports": true, /* Use the package.json 'exports' field when resolving package imports. */ | ||
// "resolvePackageJsonImports": true, /* Use the package.json 'imports' field when resolving imports. */ | ||
// "customConditions": [], /* Conditions to set in addition to the resolver-specific defaults when resolving imports. */ | ||
// "resolveJsonModule": true, /* Enable importing .json files. */ | ||
// "allowArbitraryExtensions": true, /* Enable importing files with any extension, provided a declaration file is present. */ | ||
// "noResolve": true, /* Disallow 'import's, 'require's or '<reference>'s from expanding the number of files TypeScript should add to a project. */ | ||
/* JavaScript Support */ | ||
// "allowJs": true, /* Allow JavaScript files to be a part of your program. Use the 'checkJS' option to get errors from these files. */ | ||
// "checkJs": true, /* Enable error reporting in type-checked JavaScript files. */ | ||
// "maxNodeModuleJsDepth": 1, /* Specify the maximum folder depth used for checking JavaScript files from 'node_modules'. Only applicable with 'allowJs'. */ | ||
/* Emit */ | ||
// "declaration": true, /* Generate .d.ts files from TypeScript and JavaScript files in your project. */ | ||
// "declarationMap": true, /* Create sourcemaps for d.ts files. */ | ||
// "emitDeclarationOnly": true, /* Only output d.ts files and not JavaScript files. */ | ||
// "sourceMap": true, /* Create source map files for emitted JavaScript files. */ | ||
// "inlineSourceMap": true, /* Include sourcemap files inside the emitted JavaScript. */ | ||
// "outFile": "./", /* Specify a file that bundles all outputs into one JavaScript file. If 'declaration' is true, also designates a file that bundles all .d.ts output. */ | ||
"outDir": "./dist", /* Specify an output folder for all emitted files. */ | ||
// "removeComments": true, /* Disable emitting comments. */ | ||
// "noEmit": true, /* Disable emitting files from a compilation. */ | ||
// "importHelpers": true, /* Allow importing helper functions from tslib once per project, instead of including them per-file. */ | ||
// "importsNotUsedAsValues": "remove", /* Specify emit/checking behavior for imports that are only used for types. */ | ||
// "downlevelIteration": true, /* Emit more compliant, but verbose and less performant JavaScript for iteration. */ | ||
// "sourceRoot": "", /* Specify the root path for debuggers to find the reference source code. */ | ||
// "mapRoot": "", /* Specify the location where debugger should locate map files instead of generated locations. */ | ||
// "inlineSources": true, /* Include source code in the sourcemaps inside the emitted JavaScript. */ | ||
// "emitBOM": true, /* Emit a UTF-8 Byte Order Mark (BOM) in the beginning of output files. */ | ||
// "newLine": "crlf", /* Set the newline character for emitting files. */ | ||
// "stripInternal": true, /* Disable emitting declarations that have '@internal' in their JSDoc comments. */ | ||
// "noEmitHelpers": true, /* Disable generating custom helper functions like '__extends' in compiled output. */ | ||
// "noEmitOnError": true, /* Disable emitting files if any type checking errors are reported. */ | ||
// "preserveConstEnums": true, /* Disable erasing 'const enum' declarations in generated code. */ | ||
// "declarationDir": "./", /* Specify the output directory for generated declaration files. */ | ||
// "preserveValueImports": true, /* Preserve unused imported values in the JavaScript output that would otherwise be removed. */ | ||
/* Interop Constraints */ | ||
// "isolatedModules": true, /* Ensure that each file can be safely transpiled without relying on other imports. */ | ||
// "verbatimModuleSyntax": true, /* Do not transform or elide any imports or exports not marked as type-only, ensuring they are written in the output file's format based on the 'module' setting. */ | ||
// "allowSyntheticDefaultImports": true, /* Allow 'import x from y' when a module doesn't have a default export. */ | ||
"module": "NodeNext", /* Specify what module code is generated. */ | ||
"rootDir": "./", /* Specify the root folder within your source files. */ | ||
"moduleResolution": "NodeNext", /* Specify how TypeScript looks up a file from a given module specifier. */ /* Specify multiple folders that act like './node_modules/@types'. */ | ||
"types": [ "node", "jest"], /* Specify type package names to be included without being referenced in a source file. */ /* Specify a file that bundles all outputs into one JavaScript file. If 'declaration' is true, also designates a file that bundles all .d.ts output. */ | ||
"outDir": "./dist", /* Specify an output folder for all emitted files. */ | ||
"esModuleInterop": true, /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */ | ||
// "preserveSymlinks": true, /* Disable resolving symlinks to their realpath. This correlates to the same flag in node. */ | ||
"forceConsistentCasingInFileNames": true, /* Ensure that casing is correct in imports. */ | ||
/* Type Checking */ | ||
"forceConsistentCasingInFileNames": true, /* Ensure that casing is correct in imports. */ | ||
"strict": true, /* Enable all strict type-checking options. */ | ||
// "noImplicitAny": true, /* Enable error reporting for expressions and declarations with an implied 'any' type. */ | ||
// "strictNullChecks": true, /* When type checking, take into account 'null' and 'undefined'. */ | ||
// "strictFunctionTypes": true, /* When assigning functions, check to ensure parameters and the return values are subtype-compatible. */ | ||
// "strictBindCallApply": true, /* Check that the arguments for 'bind', 'call', and 'apply' methods match the original function. */ | ||
// "strictPropertyInitialization": true, /* Check for class properties that are declared but not set in the constructor. */ | ||
// "noImplicitThis": true, /* Enable error reporting when 'this' is given the type 'any'. */ | ||
// "useUnknownInCatchVariables": true, /* Default catch clause variables as 'unknown' instead of 'any'. */ | ||
// "alwaysStrict": true, /* Ensure 'use strict' is always emitted. */ | ||
// "noUnusedLocals": true, /* Enable error reporting when local variables aren't read. */ | ||
// "noUnusedParameters": true, /* Raise an error when a function parameter isn't read. */ | ||
// "exactOptionalPropertyTypes": true, /* Interpret optional property types as written, rather than adding 'undefined'. */ | ||
// "noImplicitReturns": true, /* Enable error reporting for codepaths that do not explicitly return in a function. */ | ||
// "noFallthroughCasesInSwitch": true, /* Enable error reporting for fallthrough cases in switch statements. */ | ||
// "noUncheckedIndexedAccess": true, /* Add 'undefined' to a type when accessed using an index. */ | ||
// "noImplicitOverride": true, /* Ensure overriding members in derived classes are marked with an override modifier. */ | ||
// "noPropertyAccessFromIndexSignature": true, /* Enforces using indexed accessors for keys declared using an indexed type. */ | ||
// "allowUnusedLabels": true, /* Disable error reporting for unused labels. */ | ||
// "allowUnreachableCode": true, /* Disable error reporting for unreachable code. */ | ||
/* Completeness */ | ||
// "skipDefaultLibCheck": true, /* Skip type checking .d.ts files that are included with TypeScript. */ | ||
"skipLibCheck": true /* Skip type checking all .d.ts files. */ | ||
} | ||
} |
10
25580
48
919812