[fix] allow transpiling code under node_modules (#1754)

electrode-io · Nov 14, 2020 · 8b854a5 · 8b854a5
1 parent e95886d
commit 8b854a5
Show file tree

Hide file tree

Showing 6 changed files with 113 additions and 63 deletions.
diff --git a/packages/xarc-app-dev/src/config/archetype.ts b/packages/xarc-app-dev/src/config/archetype.ts
@@ -2,51 +2,12 @@
 
 import { XarcOptions } from "./opt2/xarc-options";
 import { getDevArchetypeLegacy } from "./options";
-import { createGitIgnoreDir } from "../lib/utils";
-const Fs = require("fs");
 const _ = require("lodash");
 const getEnvProxy = require("./env-proxy");
-const Path = require("path");
+import { saveXarcOptions } from "../lib/utils";
 
 let cachedArchetype = null;
 
-function createElectrodeTmpDir(eTmpDir = ".etmp") {
-  createGitIgnoreDir(Path.resolve(eTmpDir), "Electrode tmp dir");
-}
-
-function jsonStringifyReplacer(key, value) {
-  if (value instanceof RegExp) {
-    return value.toString();
-  }
-  return value;
-}
-
-function saveArchetypeConfig(config) {
-  const filename = `${config.eTmpDir}/xarc-options.json`;
-  const copy = { ...config, pkg: undefined, devPkg: undefined };
-  let existStr;
-
-  try {
-    existStr = Fs.readFileSync(filename, "utf-8");
-  } catch (err) {
-    //
-  }
-
-  const str = JSON.stringify(copy, jsonStringifyReplacer, 2);
-  if (str !== existStr) {
-    try {
-      createElectrodeTmpDir(config.eTmpDir);
-
-      Fs.writeFileSync(filename, str);
-    } catch (err) {
-      console.error(
-        `Unable to save development options to ${filename} - this will cause other failures.\n`,
-        err
-      );
-    }
-  }
-}
-
 /**
  * Get development options
  *
@@ -82,7 +43,7 @@ module.exports = function getDevOptions(user: XarcOptions = {}) {
     addOnFeatures: undefined
   });
 
-  saveArchetypeConfig(legacy);
+  saveXarcOptions(legacy);
 
   cachedArchetype = legacy;
 

diff --git a/packages/xarc-app-dev/src/config/opt2/babel-options.ts b/packages/xarc-app-dev/src/config/opt2/babel-options.ts
@@ -61,6 +61,22 @@ export type BabelOptions = {
    */
   transformClassProps?: boolean | { loose: boolean };
 
+  /**
+   * List of RegExp to match files that should be included for transpiling.
+   *
+   * By default, files under node_modules are not transpiled.
+   *
+   * You can set this to control that.  ie: to compile everything under node_modules, use `[/node_modules/]`
+   */
+  includeRegExp?: RegExp[];
+
+  /**
+   * List of RegExp to match files that should not be transpiled by babel.
+   *
+   * This is checked after includeRegExp
+   */
+  excludeRegExp?: RegExp[];
+
   // DEPRECATE: looseClassProps?: boolean;
 
   // DEPRECATE:

diff --git a/packages/xarc-app-dev/src/lib/utils.ts b/packages/xarc-app-dev/src/lib/utils.ts
@@ -69,6 +69,24 @@ export function createGitIgnoreDir(dir, comment) {
   }
 }
 
+const regExpSig = "@xarc/__RegExp__@";
+
+export const jsonStringifier = (key, value) => {
+  if (value instanceof RegExp) {
+    return `${regExpSig}${value.toString()}`;
+  } else {
+    return value;
+  }
+};
+
+export const jsonParser = (key, value) => {
+  if (typeof value === "string" && value.startsWith(regExpSig)) {
+    return new RegExp(value.substr(regExpSig.length));
+  } else {
+    return value;
+  }
+};
+
 let cachedXarcOptions;
 
 export function loadXarcOptions(dir: string = process.cwd()) {
@@ -78,7 +96,7 @@ export function loadXarcOptions(dir: string = process.cwd()) {
   const filename = Path.join(dir, ".etmp/xarc-options.json");
   try {
     const data = Fs.readFileSync(filename, "utf-8");
-    return (cachedXarcOptions = JSON.parse(data));
+    return (cachedXarcOptions = JSON.parse(data, jsonParser));
   } catch (err) {
     // eslint-disable-next-line
     console.error(ck`
@@ -100,6 +118,36 @@ xarc's development code.
   }
 }
 
+function createElectrodeTmpDir(eTmpDir = ".etmp") {
+  createGitIgnoreDir(Path.resolve(eTmpDir), "Electrode tmp dir");
+}
+
+export function saveXarcOptions(config) {
+  const filename = `${config.eTmpDir}/xarc-options.json`;
+  const copy = { ...config, pkg: undefined, devPkg: undefined };
+  let existStr;
+
+  try {
+    existStr = Fs.readFileSync(filename, "utf-8");
+  } catch (err) {
+    //
+  }
+
+  const str = JSON.stringify(copy, jsonStringifier, 2);
+  if (str !== existStr) {
+    try {
+      createElectrodeTmpDir(config.eTmpDir);
+
+      Fs.writeFileSync(filename, str);
+    } catch (err) {
+      console.error(
+        `Unable to save development options to ${filename} - this will cause other failures.\n`,
+        err
+      );
+    }
+  }
+}
+
 export function detectCSSModule(xOptions) {
   const cssModuleSupport = _.get(xOptions, "webpack.cssModuleSupport", undefined);
   if (cssModuleSupport === undefined) {

diff --git a/packages/xarc-webpack/src/partials/babel.ts b/packages/xarc-webpack/src/partials/babel.ts
@@ -12,9 +12,28 @@ module.exports = function(options) {
   const AppMode = xarcOptions.AppMode;
 
   const clientVendor = Path.join(AppMode.src.client, "vendor/");
-  const babelExclude = x => {
-    if (x.indexOf("node_modules") >= 0) return true;
-    if (x.indexOf(clientVendor) >= 0) return true;
+  const { includeRegExp, excludeRegExp } = xarcOptions.babel;
+
+  const babelExclude = (x: string) => {
+    if (includeRegExp && includeRegExp.find((r: RegExp) => x.match(r))) {
+      return false;
+    }
+
+    if (excludeRegExp && excludeRegExp.find((r: RegExp) => x.match(r))) {
+      return true;
+    }
+
+    if (x.indexOf("node_modules") >= 0) {
+      if (x.indexOf("~es2x~") >= 0 || x.indexOf("~es6~") >= 0) {
+        return false;
+      }
+      return true;
+    }
+
+    if (x.indexOf(clientVendor) >= 0) {
+      return true;
+    }
+
     return false;
   };
 

diff --git a/packages/xarc-webpack/src/partials/extract-style.ts b/packages/xarc-webpack/src/partials/extract-style.ts
@@ -142,19 +142,13 @@ module.exports = function() {
     {
       _name: `extract-css`,
       test: /\.css$/,
-      use: [
-        miniCssExtractLoader(false),
-        ...getCssQueryUse(false)
-      ],
-      ...(enableCssModule && { exclude: cssModuleRegExp }),
+      use: [miniCssExtractLoader(false), ...getCssQueryUse(false)],
+      ...(enableCssModule && { exclude: cssModuleRegExp })
     },
     enableCssModule && {
       _name: `extract-css-modules`,
       test: /\.css$/,
-      use: [
-        miniCssExtractLoader(true),
-        ...getCssQueryUse(true)
-      ],
+      use: [miniCssExtractLoader(true), ...getCssQueryUse(true)],
       include: cssModuleRegExp
     }
   );
@@ -172,7 +166,7 @@ module.exports = function() {
           miniCssExtractLoader(false),
           ...getCssQueryUse(false).concat({ loader: sassLoader } as any)
         ],
-        ...(enableCssModule && { exclude: cssModuleRegExp }),
+        ...(enableCssModule && { exclude: cssModuleRegExp })
       },
       enableCssModule && {
         _name: `extract-css-modules-scss`,
@@ -198,7 +192,7 @@ module.exports = function() {
         _name: `extract-css-stylus`,
         test: /\.styl$/,
         use: [miniCssExtractLoader(false), ...getCssQueryUse(false).concat(stylusQuery)],
-        ...(enableCssModule && { exclude: cssModuleRegExp }),
+        ...(enableCssModule && { exclude: cssModuleRegExp })
       },
       enableCssModule && {
         _name: `extract-css-modules-stylus`,
@@ -221,7 +215,7 @@ module.exports = function() {
           miniCssExtractLoader(false),
           ...getCssQueryUse(false).concat({ loader: lessLoader } as any)
         ],
-        ...(enableCssModule && { exclude: cssModuleRegExp }),
+        ...(enableCssModule && { exclude: cssModuleRegExp })
       },
       enableCssModule && {
         _name: `extract-css-modules-less`,

diff --git a/packages/xarc-webpack/src/util/load-xarc-options.ts b/packages/xarc-webpack/src/util/load-xarc-options.ts
@@ -1,20 +1,32 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
 
+// copied from @xarc/app-dev/lib/utils for now because of circular dep
+// TODO: make a @xarc/common package for base utils etc
+
 const ck = require("chalker");
 const Path = require("path");
 const Fs = require("fs");
 
-let loaded;
+const regExpSig = "@xarc/__RegExp__@";
+
+export const jsonParser = (key, value) => {
+  if (typeof value === "string" && value.startsWith(regExpSig)) {
+    return new RegExp(value.substr(regExpSig.length));
+  } else {
+    return value;
+  }
+};
+
+let cachedXarcOptions;
 
 export function loadXarcOptions(dir: string = process.cwd()) {
-  if (loaded) {
-    return loaded;
+  if (cachedXarcOptions) {
+    return cachedXarcOptions;
   }
-  dir = dir || process.cwd();
   const filename = Path.join(dir, ".etmp/xarc-options.json");
   try {
     const data = Fs.readFileSync(filename, "utf-8");
-    return (loaded = JSON.parse(data));
+    return (cachedXarcOptions = JSON.parse(data, jsonParser));
   } catch (err) {
     // eslint-disable-next-line
     console.error(ck`
@@ -28,7 +40,7 @@ Please run "clap setup-dev" once to initialize the file
 <cyan>.etmp/xarc-options.json</> before doing your thing that loads
 xarc's development code.
 `);
-    return (loaded = {
+    return (cachedXarcOptions = {
       webpack: {},
       babel: {},
       options: {}