index.mjs 3.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586
  1. import browserslist from 'browserslist';
  2. const plugin = opts => {
  3. return {
  4. postcssPlugin: 'postcss-browser-comments',
  5. Once(root) {
  6. // client browserslist
  7. const clientBrowserList = browserslist(Object(opts).browsers || null, {
  8. path: root.source && root.source.input && root.source.input.file
  9. }); // root children references
  10. const references = root.nodes.slice(0); // for each child node of the root children references
  11. for (const node of references) {
  12. // if the node is a comment browser comment node
  13. if (isBrowserCommentNode(node)) {
  14. // rule following the browser comment
  15. const rule = node.next(); // browser data
  16. const browserdata = getBrowserData(node.text);
  17. if (browserdata.isNumbered) {
  18. rule.nodes.filter(isBrowserReferenceCommentNode).map(comment => {
  19. const browserdataIndex = parseFloat(comment.text) - 1;
  20. const browserslistPart = browserdata.browserslist[browserdataIndex]; // whether to remove the rule if the comment browserslist does not match the client browserslist
  21. const removeRule = !clientBrowserList.some(clientBrowser => browserslist(browserslistPart).some(commentBrowser => commentBrowser === clientBrowser)); // conditionally remove the declaration and reference comment
  22. if (removeRule) {
  23. comment.prev().remove();
  24. comment.remove();
  25. }
  26. }); // conditionally remove the empty rule and comment
  27. if (!rule.nodes.length) {
  28. rule.remove();
  29. node.remove();
  30. }
  31. } else {
  32. // whether to remove the rule if the comment browserslist does not match the client browserslist
  33. const removeRule = !clientBrowserList.some(clientBrowser => browserslist(browserdata.browserslist).some(commentBrowser => commentBrowser === clientBrowser)); // conditionally remove the rule and comment
  34. if (removeRule) {
  35. rule.remove();
  36. node.remove();
  37. }
  38. }
  39. }
  40. }
  41. }
  42. };
  43. };
  44. plugin.postcss = true;
  45. const isBrowserCommentNode = node => node.type === 'comment' && isBrowserCommentNodeRegExp.test(node.text) && node.next().type === 'rule';
  46. const isBrowserCommentNodeRegExp = /^\*\n * /; // returns whether a node is a browser reference comment
  47. const isBrowserReferenceCommentNode = node => node.type === 'comment' && isBrowserReferenceCommentNodeRegExp.test(node.text);
  48. const isBrowserReferenceCommentNodeRegExp = /^\d+$/; // returns browser data from comment text
  49. const getBrowserData = text => {
  50. const browserDataNumbered = text.match(browserDataMutliRegExp);
  51. const isNumbered = Boolean(browserDataNumbered);
  52. return {
  53. browserslist: isNumbered ? browserDataNumbered.map(browserslistPart => getBrowsersList(browserslistPart.replace(browserDataNumberedNewlineRegExp, '$1'))) : getBrowsersList(text.replace(browserDataNewlineRegExp, '')),
  54. isNumbered
  55. };
  56. };
  57. const browserDataMutliRegExp = /(\n \* \d+\. (?:[^\n]+|\n \* {4,})+)/g;
  58. const browserDataNewlineRegExp = /^\*\n \* ?|\n \*/g;
  59. const browserDataNumberedNewlineRegExp = /\n \* (?:( )\s*)?/g; // returns a browserlist from comment text
  60. const getBrowsersList = text => text.split(getBrowsersListInSplitRegExp).slice(1).map(part => part.split(getBrowsersListAndSplitRegExp).filter(part2 => part2)).reduce((acc, val) => acc.concat(val), []).map(part => part.replace(getBrowsersListQueryRegExp, ($0, browser, query) => browser === 'all' ? '> 0%' : `${browser}${query ? /^((?:\d*\.)?\d+)-$/.test(query) ? ` <= ${query.slice(0, -1)}` : ` ${query}` : ' > 0'}`).toLowerCase());
  61. const getBrowsersListInSplitRegExp = /\s+in\s+/;
  62. const getBrowsersListAndSplitRegExp = /(?: and|, and|,)/;
  63. const getBrowsersListQueryRegExp = /^\s*(\w+)(?: ((?:(?:\d*\.)?\d+-)?(?:\d*\.)?\d+[+-]?))?.*$/;
  64. export default plugin;
  65. //# sourceMappingURL=index.mjs.map