@zohodesk/react-cli 1.1.16-exp.2 → 1.1.16-exp.4

package/bin/cli.js

@@ -76,6 +76,14 @@ switch (option) {
       { stdio: 'inherit' }
     );
 
+    process.exit(result.status);
+    break;
+  case 'autoprefix':
+    result = spawnSync(
+      'node',
+      [require.resolve('../lib/utils/autoprefixer')].concat(args),
+      { stdio: 'inherit' }
+    );
     process.exit(result.status);
     break;
   case 'variableConverter':

package/lib/loaderUtils/getCSSLoaders.js

@@ -82,7 +82,7 @@ const getCSSLoaders = optionsObj => {
 
       return `${prefix} ${selector}`; // Make selectors like [dir=rtl] > .selector
     }
-  }), plugins.selectorReplace && require('../postcss-plugins/SelectorReplace')(selectorReplace), plugins.combinerMediaQuery && require('postcss-combine-media-query')(), plugins.hoverActive && require('../postcss-plugins/hoverActivePlugin')(mediaQueryHoverActiveString), plugins.cssVariableReplacement && fs.existsSync(cssVariableReplacementConfig) && require('../postcss-plugins/variableModificationPlugin/index').plugin(cssVariableReplacementConfig), plugins.autoPrefixer && require('../postcss-plugins/AutoPrefixer')(prefixConfig) // require('autoprefixer')({ flexbox: true, grid: false })
+  }), plugins.selectorReplace && require('../postcss-plugins/SelectorReplace')(selectorReplace), plugins.combinerMediaQuery && require('postcss-combine-media-query')(), plugins.hoverActive && require('../postcss-plugins/hoverActivePlugin')(mediaQueryHoverActiveString), plugins.cssVariableReplacement && fs.existsSync(cssVariableReplacementConfig) && require('../postcss-plugins/variableModificationPlugin/index').plugin(cssVariableReplacementConfig), plugins.autoPrefixer && require('@zohodesk-private/prefix_remove/es/cli_plugin/AutoPrefixer')(prefixConfig) // require('autoprefixer')({ flexbox: true, grid: false })
   // ,
   // plugins.composeMinification &&
   //   require('../postcss-plugins/composePlugin')()

package/lib/schemas/index.js

@@ -97,6 +97,16 @@ var _default = {
       defaultSelector: '',
       customFileDetails: '',
       excludeStrings: []
+    },
+    prefixConfig: {
+      include: {},
+      exclude: [],
+      removerExclude: [],
+      replacements: null,
+      browsers: null,
+      defaultPrefixesPath: '',
+      removedPropertyPath: '',
+      prefixesPresentPath: ''
     }
   },
   efc: {
@@ -294,6 +304,7 @@ var _default = {
     prefixConfig: {
       include: {},
       exclude: [],
+      removerExclude: [],
       replacements: null,
       browsers: null,
       defaultPrefixesPath: '',
@@ -420,6 +431,7 @@ var _default = {
     prefixConfig: {
       include: {},
       exclude: [],
+      removerExclude: [],
       replacements: null,
       browsers: null,
       defaultPrefixesPath: '',

package/lib/utils/autoprefixer.js

@@ -0,0 +1,52 @@
+"use strict";
+
+var _postcss = _interopRequireDefault(require("postcss"));
+
+var _AutoPrefixer = _interopRequireDefault(require("@zohodesk-private/prefix_remove/es/cli_plugin/AutoPrefixer"));
+
+var _path = _interopRequireDefault(require("path"));
+
+var _fs = _interopRequireDefault(require("fs"));
+
+var _folderIterator = _interopRequireDefault(require("./folderIterator"));
+
+var _getOptions = _interopRequireDefault(require("./getOptions"));
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+let cwd = process.cwd();
+
+let src = _path.default.join(cwd, process.argv[2]);
+
+let dist = _path.default.join(cwd, process.argv[3]);
+
+let canWacth = '-w' === process.argv[4];
+
+function watchHandler(fromPath, toPath) {
+  let css = _fs.default.readFileSync(fromPath);
+
+  const options = (0, _getOptions.default)();
+  const {
+    prefixConfig
+  } = options.css;
+  (0, _postcss.default)([(0, _AutoPrefixer.default)(prefixConfig)]).process(css, {
+    from: fromPath,
+    to: toPath
+  }).then(result => {
+    _fs.default.writeFile(toPath, result.css, () => true);
+
+    if (result.map) {
+      _fs.default.writeFile(`${toPath}.map`, result.map, () => true);
+    }
+  });
+}
+
+(0, _folderIterator.default)(src, dist, ['.css'], false, (fromPath, toPath) => {
+  if (canWacth && fromPath) {
+    _fs.default.watchFile(fromPath, () => {
+      watchHandler(fromPath, toPath);
+    });
+  }
+
+  watchHandler(fromPath, toPath);
+});

package/npm-shrinkwrap.json

@@ -1,6 +1,6 @@
 {
   "name": "@zohodesk/react-cli",
-  "version": "1.1.14",
+  "version": "1.1.17",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {
@@ -2118,6 +2118,35 @@
       "resolved": "https://registry.npmjs.org/@xtuc/long/-/long-4.2.2.tgz",
       "integrity": "sha512-NuHqBY1PB/D8xU6s/thBgOAiAP7HOYDQ32+BFZILJ8ivkUkAHQnWfn6WhL79Owj1qmUnoN/YPhktdIoucipkAQ=="
     },
+    "@zohodesk-private/prefix_remove": {
+      "version": "1.0.9",
+      "resolved": "http://cm-npmregistry.csez.zohocorpin.com/@zohodesk-private%2fprefix_remove/-/prefix_remove-1.0.9.tgz",
+      "integrity": "sha512-EPmcnUlsMjQAt605f7s5DnfJOCDADp50lqaEn+iXES8TBxEzFJqmgxiBHcVLIucLHMGBoYdyiYs664rFlxPp+A==",
+      "requires": {
+        "postcss": "^7.0.39"
+      },
+      "dependencies": {
+        "picocolors": {
+          "version": "0.2.1",
+          "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-0.2.1.tgz",
+          "integrity": "sha512-cMlDqaLEqfSaW8Z7N5Jw+lyIW869EzT73/F5lhtY9cLGoVxSXznfgfXMO0Z5K0o0Q2TkTXq+0KFsdnSe3jDViA=="
+        },
+        "postcss": {
+          "version": "7.0.39",
+          "resolved": "https://registry.npmjs.org/postcss/-/postcss-7.0.39.tgz",
+          "integrity": "sha512-yioayjNbHn6z1/Bywyb2Y4s3yvDAeXGOyxqD+LnVOinq6Mdmd++SW2wUNVzavyyHxd6+DxzWGIuosg6P1Rj8uA==",
+          "requires": {
+            "picocolors": "^0.2.1",
+            "source-map": "^0.6.1"
+          }
+        },
+        "source-map": {
+          "version": "0.6.1",
+          "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
+          "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g=="
+        }
+      }
+    },
     "@zohodesk/client_packages_group": {
       "version": "1.0.2",
       "resolved": "https://registry.npmjs.org/@zohodesk/client_packages_group/-/client_packages_group-1.0.2.tgz",
@@ -2640,27 +2669,6 @@
       "resolved": "https://registry.npmjs.org/atob/-/atob-2.1.2.tgz",
       "integrity": "sha512-Wm6ukoaOGJi/73p/cl2GvLjTI5JM1k/O14isD73YML8StrH/7/lRFgmg8nICZgD3bZZvjwCGxtMOD3wWNAu8cg=="
     },
-    "autoprefixer": {
-      "version": "9.8.8",
-      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-9.8.8.tgz",
-      "integrity": "sha512-eM9d/swFopRt5gdJ7jrpCwgvEMIayITpojhkkSMRsFHYuH5bkSQ4p/9qTEHtmNudUZh22Tehu7I6CxAW0IXTKA==",
-      "requires": {
-        "browserslist": "^4.12.0",
-        "caniuse-lite": "^1.0.30001109",
-        "normalize-range": "^0.1.2",
-        "num2fraction": "^1.2.2",
-        "picocolors": "^0.2.1",
-        "postcss": "^7.0.32",
-        "postcss-value-parser": "^4.1.0"
-      },
-      "dependencies": {
-        "picocolors": {
-          "version": "0.2.1",
-          "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-0.2.1.tgz",
-          "integrity": "sha512-cMlDqaLEqfSaW8Z7N5Jw+lyIW869EzT73/F5lhtY9cLGoVxSXznfgfXMO0Z5K0o0Q2TkTXq+0KFsdnSe3jDViA=="
-        }
-      }
-    },
     "aws-sign2": {
       "version": "0.7.0",
       "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.7.0.tgz",
@@ -9944,11 +9952,6 @@
       "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
       "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA=="
     },
-    "normalize-range": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/normalize-range/-/normalize-range-0.1.2.tgz",
-      "integrity": "sha512-bdok/XvKII3nUpklnV6P2hxtMNrCboOjAcyBuQnWEhO665FwrSNRxU+AqpsyvO6LgGYPspN+lu5CLtw4jPRKNA=="
-    },
     "normalize-url": {
       "version": "1.9.1",
       "resolved": "https://registry.npmjs.org/normalize-url/-/normalize-url-1.9.1.tgz",
@@ -9997,11 +10000,6 @@
         "boolbase": "^1.0.0"
       }
     },
-    "num2fraction": {
-      "version": "1.2.2",
-      "resolved": "https://registry.npmjs.org/num2fraction/-/num2fraction-1.2.2.tgz",
-      "integrity": "sha512-Y1wZESM7VUThYY+4W+X4ySH2maqcA+p7UR+w8VWNWVAd6lwuXXWz/w/Cz43J/dI2I+PS6wD5N+bJUF+gjWvIqg=="
-    },
     "number-is-nan": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/number-is-nan/-/number-is-nan-1.0.1.tgz",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zohodesk/react-cli",
-  "version": "1.1.16-exp.2",
+  "version": "1.1.16-exp.4",
   "description": "A CLI tool for build modern web application and libraries",
   "scripts": {
     "init": "node ./lib/utils/init.js",
@@ -40,13 +40,13 @@
     "@babel/preset-env": "7.11.0",
     "@babel/preset-react": "7.10.4",
     "@babel/runtime": "7.11.2",
+    "@zohodesk-private/prefix_remove": "^1.0.9",
     "@zohodesk/client_packages_group": "1.0.2",
     "@zohodesk/eslint-plugin-react-performance": "1.0.3",
     "@zohodesk/eslint-plugin-zsecurity": "0.0.1-beta.4",
     "@zohodesk/postcss-rtl": "1.5.2",
     "@zohodesk/propertytojson": "1.0.1",
     "@zohodesk/screenshot-test": "0.0.1-beta.20",
-    "autoprefixer": "^9.8.8",
     "babel-eslint": "10.1.0",
     "babel-jest": "26.3.0",
     "babel-loader": "8.1.0",

package/lib/postcss-plugins/AutoPrefixer.js

@@ -1,194 +0,0 @@
-"use strict";
-
-var _postcss = _interopRequireDefault(require("postcss"));
-
-var _fs = _interopRequireDefault(require("fs"));
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-module.exports = _postcss.default.plugin('autoprefixer', prefixConfig => {
-  const filePath = prefixConfig && prefixConfig.defaultPrefixesPath ? prefixConfig.defaultPrefixesPath : './defaultPrefixes.json';
-
-  if (!_fs.default.existsSync(filePath)) {
-    console.error('default prefixes file not found! AutoPrefixer will not work, kindly check!');
-    return;
-  }
-
-  const prefixes = JSON.parse(_fs.default.readFileSync(filePath, 'utf-8'));
-  const prefixVals = Object.keys(prefixes).filter(key => prefixes[key].key);
-  const prefixValObj = {};
-  prefixVals.forEach(val => {
-    prefixValObj[prefixes[val].value] = prefixes[val];
-  });
-  const removedPropertiesPath = prefixConfig && prefixConfig.removedPropertyPath ? prefixConfig.removedPropertyPath : './removedProperties.json';
-
-  if (_fs.default.existsSync(removedPropertiesPath)) {
-    const removedProperties = JSON.parse(_fs.default.readFileSync(removedPropertiesPath, 'utf-8'));
-    const valuesNotFound = [];
-    removedProperties.forEach(property => {
-      if (!Object.keys(prefixes).includes(property) && !Object.keys(prefixConfig.include).includes(property) && !Object.keys(prefixConfig.exclude).includes(property)) {
-        valuesNotFound.push(property);
-      }
-    });
-
-    if (valuesNotFound.length > 0) {
-      console.error('Autoprefixer Properties not Handled : ');
-      valuesNotFound.forEach(value => {
-        console.error(value);
-      });
-      throw new Error('Kindly ensure these properties are handled through defaultPrefixes.json or prefixConfig.include or prefixConfig.exclude ');
-    }
-  }
-
-  return root => {
-    root.walkAtRules(rule => {
-      const previous = rule.parent.nodes[rule.parent.nodes.indexOf(rule) - 1];
-
-      if (previous && previous.type === 'comment' && previous.text === 'prefix:ignore') {
-        return;
-      }
-
-      if (rule.name === 'keyframes' && !prefixConfig.exclude.includes('@keyframes') && prefixConfig.include && (Object.keys(prefixConfig.include).length === 0 || Object.keys(prefixConfig.include).includes('@keyframes'))) {
-        const newPrefixes = [];
-        const replacements = prefixConfig.replacements && prefixConfig.replacements['@keyframes'] ? prefixConfig.replacements['@keyframes'] : {}; // if (!prefixes['@keyframes'] && !replacements) {
-        //   return;
-        // }
-
-        const mozRule = rule.clone();
-
-        if (mozRule.name && prefixConfig.browsers && prefixConfig.browsers.mozilla) {
-          // custom value need to change
-          if (prefixConfig.include['@keyframes'] && !prefixConfig.include['@keyframes'].mozilla && !prefixes['@keyframes'].mozilla) {
-            return;
-          }
-
-          mozRule.name = replacements && replacements.mozilla ? replacements.mozilla : prefixes['@keyframes'].mozilla;
-
-          if (mozRule.name !== undefined) {
-            newPrefixes.push(mozRule);
-          }
-        }
-
-        const chromeRule = rule.clone(); // custom value need to change
-
-        if (chromeRule.name && prefixConfig.browsers && prefixConfig.browsers.chrome) {
-          if (prefixConfig.include['@keyframes'] && !prefixConfig.include['@keyframes'].chrome && !prefixes['@keyframes'].chrome) {
-            return;
-          }
-
-          chromeRule.name = replacements && replacements.chrome ? replacements.chrome : prefixes['@keyframes'].chrome;
-
-          if (chromeRule.name !== undefined) {
-            newPrefixes.push(chromeRule);
-          }
-        }
-
-        const operaRule = rule.clone(); // custom value need to change
-
-        if (operaRule.name && prefixConfig.browsers && prefixConfig.browsers.opera) {
-          if (prefixConfig.include['@keyframes'] && !prefixConfig.include['@keyframes'].opera && !prefixes['@keyframes'].opera) {
-            return;
-          }
-
-          operaRule.name = replacements && replacements.opera ? replacements.opera : prefixes['@keyframes'].opera;
-
-          if (operaRule.name !== undefined) {
-            newPrefixes.push(operaRule);
-          }
-        }
-
-        const ieRule = rule.clone(); // custom value need to change
-
-        if (ieRule.name && prefixConfig.browsers && prefixConfig.browsers.ie) {
-          if (prefixConfig.include['@keyframes'] && !prefixConfig.include['@keyframes'].ie && !prefixes['@keyframes'].ie) {
-            return;
-          }
-
-          ieRule.name = replacements && replacements.ie ? replacements.ie : prefixes['@keyframes'].ie;
-
-          if (ieRule.name !== undefined) {
-            newPrefixes.push(ieRule);
-          }
-        }
-
-        rule.parent.insertAfter(rule, newPrefixes); // console.log(`${rule.name} : ${rule.params}`);
-
-        return;
-      }
-    });
-    root.walkRules(rule => {
-      rule.walkDecls(decl => {
-        const previous = decl.parent.nodes[decl.parent.nodes.indexOf(decl) - 1];
-
-        if (previous && previous.type === 'comment' && previous.text === 'prefix:ignore') {
-          return;
-        }
-
-        if (Object.keys(prefixes).includes(decl.prop) && !prefixConfig.exclude.includes(decl.prop) && prefixConfig.include && (Object.keys(prefixConfig.include).length === 0 || Object.keys(prefixConfig.include).includes(decl.prop))) {
-          const newPrefixes = [];
-          const replacements = prefixConfig.replacements && prefixConfig.replacements[decl.prop] ? prefixConfig.replacements[decl.prop] : {}; // if (!prefixes[decl.prop] && !replacements) {
-          //   return;
-          // }
-
-          const mozDecl = decl.clone(); // custom value need to change
-
-          if (mozDecl.prop && prefixConfig.browsers && prefixConfig.browsers.mozilla) {
-            if (prefixConfig.include[decl.prop] && !prefixConfig.include[decl.prop].mozilla && !prefixes[decl.prop].mozilla) {
-              return;
-            }
-
-            mozDecl.prop = replacements && replacements.mozilla ? replacements.mozilla : prefixes[decl.prop].mozilla;
-
-            if (mozDecl.prop !== undefined) {
-              newPrefixes.push(mozDecl);
-            }
-          }
-
-          const chromeDecl = decl.clone(); // custom value need to change
-
-          if (chromeDecl.prop && prefixConfig.browsers && prefixConfig.browsers.chrome) {
-            if (prefixConfig.include[decl.prop] && !prefixConfig.include[decl.prop].chrome && !prefixes[decl.prop].chrome) {
-              return;
-            }
-
-            chromeDecl.prop = replacements && replacements.chrome ? replacements.chrome : prefixes[decl.prop].chrome;
-
-            if (chromeDecl.prop !== undefined) {
-              newPrefixes.push(chromeDecl);
-            }
-          }
-
-          const operaDecl = decl.clone(); // custom value need to change
-
-          if (operaDecl.prop && prefixConfig.browsers && prefixConfig.browsers.opera) {
-            if (prefixConfig.include[decl.prop] && !prefixConfig.include[decl.prop].opera && !prefixes[decl.prop].opera) {
-              return;
-            }
-
-            operaDecl.prop = replacements && replacements.opera ? replacements.opera : prefixes[decl.prop].opera;
-
-            if (operaDecl.prop !== undefined) {
-              newPrefixes.push(operaDecl);
-            }
-          }
-
-          const ieDecl = decl.clone(); // custom value need to change
-
-          if (ieDecl.prop && prefixConfig.browsers && prefixConfig.browsers.ie) {
-            if (prefixConfig.include[decl.prop] && !prefixConfig.include[decl.prop].ie && !prefixes[decl.prop].ie) {
-              return;
-            }
-
-            ieDecl.prop = replacements && replacements.ie ? replacements.ie : prefixes[decl.prop].ie;
-
-            if (ieDecl.prop !== undefined) {
-              newPrefixes.push(ieDecl);
-            }
-          }
-
-          decl.parent.insertAfter(decl, newPrefixes); // console.log(`${decl.prop} : ${decl.value}`);
-        }
-      });
-    });
-  };
-});