@zohodesk/client_build_tool 0.0.6-exp.23 → 0.0.6-exp.24

package/lib/schemas/defaultConfigValues.js

@@ -323,6 +323,12 @@ var _default = {
     cssAttributes: null,
     i18nAttributes: null
   },
-  externals: null
+  externals: null,
+  typeScript: {
+    enable: {
+      value: false,
+      cli: 'type_script_enable'
+    }
+  }
 };
 exports.default = _default;

package/lib/shared/babel/babelWebConfig.js

@@ -25,8 +25,11 @@ function babelWebConfig(options, mode) {
     plugins: babelPlugins,
     browserList
   } = options.babelCustomizations;
+  const {
+    enable: typeScriptEnable
+  } = options.typeScript;
   return {
-    presets: [getBabelPresetEnvConfig(browserList, mode), require.resolve('@babel/preset-react')],
+    presets: typeScriptEnable ? [getBabelPresetEnvConfig(browserList, mode), require.resolve('@babel/preset-react'), require.resolve('@babel/preset-typescript')] : [getBabelPresetEnvConfig(browserList, mode), require.resolve('@babel/preset-react')],
     plugins: customBabelPlugins(babelPlugins).concat((0, _getBabelPlugin.getBabelPlugin)(options)).filter(Boolean)
   };
 }

package/lib/shared/babel/runBabelForTsFile.js

@@ -0,0 +1,30 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.runBabelForTSFile = runBabelForTSFile;
+
+var _core = require("@babel/core");
+
+var _babelWebConfig = require("./babelWebConfig");
+
+var _copyFile = require("../fileUtils/copyFile");
+
+function runBabelForTSFile({
+  filename,
+  outputFile,
+  options,
+  mode = 'es'
+}) {
+  const {
+    enable
+  } = options.typeScript;
+
+  if (enable) {
+    // const jsSourceCode = readFileSync(filename).toString();
+    const babelConfig = (0, _babelWebConfig.babelWebConfig)(options, mode);
+    const result = (0, _core.transformFileSync)(filename, babelConfig);
+    (0, _copyFile.writeFile)(outputFile.replace('.tsx', '.js'), result.code);
+  }
+}

package/lib/shared/bundler/webpack/custom_plugins/CdnChangePlugin.js

@@ -0,0 +1,99 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+var _htmlWebpackPlugin = _interopRequireDefault(require("html-webpack-plugin"));
+
+var _nameTemplates = require("../common/nameTemplates");
+
+var _modeUtils = require("../common/modeUtils");
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+// import { RuntimeGlobals, RuntimeModule } from 'webpack';
+// import { Template } from 'webpack';
+const pluginName = 'CdnChangePlugin'; // const MODULE_TYPE = 'css/mini-extract';
+// class CdnChangeRuntimePlugin extends RuntimeModule {
+//   constructor(compiler, { variableName }) {
+//     super('cdn loading', 10);
+//     this.variableName = variableName;
+//   }
+//   generate() {
+//     return `${RuntimeGlobals.getChunkCssFilename} = function(chunkId) {
+//       const cssCdnUrl = window[${this.variableName}] || chunkId;
+//       return cssCdnUrl;
+//     }`;
+//   }
+// }
+
+class CdnChangePlugin {
+  constructor(options) {
+    this.createSeparateSMap = options.createSeparateSMap;
+    this.i18nTemplate = options.i18nTemplate || '{{__I18N_CDN__}}';
+    this.variableName = options.variableName || '__CSS_CDN__';
+    this.cssTemplate = options.cssTemplate || '{{__CSS_CDN__}}';
+    this.jsTemplate = options.jsTemplate || '{{__JS_CDN__}}';
+    this.mode = options.mode || 'prod';
+  }
+
+  apply(compiler) {
+    // compiler.hooks.thisCompilation.tap(pluginName, compilation => {
+    //   const enabledChunks = new WeakSet();
+    //   const handler = (entryRuntimeChunk, set) => {
+    //     if (enabledChunks.has(entryRuntimeChunk)) {
+    //       return;
+    //     }
+    //     enabledChunks.add(entryRuntimeChunk);
+    //     set.add(RuntimeGlobals.getFullHash);
+    //     set.add(RuntimeGlobals.getChunkCssFilename);
+    //     compilation.addRuntimeModule(
+    //       entryRuntimeChunk,
+    //       new CdnChangeRuntimePlugin(set, {
+    //         compiler,
+    //         variableName: this.variableName
+    //       })
+    //     );
+    //   };
+    //   compilation.hooks.runtimeRequirementInTree
+    //     .for(RuntimeGlobals.ensureChunkHandlers)
+    //     .tap(pluginName, handler);
+    // });
+    compiler.hooks.compilation.tap(pluginName, compilation => {
+      _htmlWebpackPlugin.default.getHooks(compilation).beforeAssetTagGeneration.tap(pluginName, (data, cb) => {
+        const {
+          createSeparateSMap,
+          mode
+        } = this; // eslint-disable-next-line no-param-reassign
+
+        data.assets = { ...data.assets,
+          css: data.assets.css.map(css => `${this.cssTemplate}${css}`),
+          js: data.assets.js.map(js => {
+            if (((0, _modeUtils.isProductionMode)(mode) || createSeparateSMap) && !(0, _nameTemplates.isI18nFile)(js)) {
+              js = js.replace('js/', `{{--js-smap}}js/`); //eslint-disable-line
+            }
+
+            return `${(0, _nameTemplates.isI18nFile)(js) ? this.i18nTemplate : this.jsTemplate}${js}`;
+          })
+        };
+        cb && cb(null, data);
+      });
+    });
+  }
+
+}
+
+var _default = CdnChangePlugin; // Cdn Change Plugin for runtime chunks???
+
+/**
+ * the filename of the script part of the chunk
+ */
+// exports.getChunkScriptFilename = "__webpack_require__.u";
+// /**
+//  * the filename of the css part of the chunk
+//  */
+// exports.getChunkCssFilename = "__webpack_require__.k";
+
+exports.default = _default;

package/lib/shared/bundler/webpack/resolvers.js

@@ -62,7 +62,8 @@ function moduleResolver(options) {
     modules: useAppNodeModulesAsPreferred(preferLocalFirst, [nodeModulesPath, _constants.cliNodeModulesPath].filter(Boolean)),
     alias: { ...(defaultAlias ? _libAlias.libAlias : {}),
       ...(alias || {})
-    }
+    },
+    extensions: ['.ts', '.js', '.json', '.tsx']
   };
 }
 

package/lib/shared/bundler/webpack/tsLoaders.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.tsLoaders = tsLoaders;
+
+var _babelLoaderConfig = require("./loaderConfigs/babelLoaderConfig");
+
+function tsLoaders(options) {
+  return [{
+    test: /\.tsx$/,
+    exclude: /node_modules/,
+    use: [(0, _babelLoaderConfig.babelLoaderConfig)(options)] // include: path.join(appPath, folder)
+
+  }];
+}

package/lib/shared/bundler/webpack/webpackConfig.js

@@ -11,6 +11,8 @@ var _outputConfig = require("./outputConfig");
 
 var _jsLoaders = require("./jsLoaders");
 
+var _tsLoaders = require("./tsLoaders");
+
 var _cssLoaders = require("./cssLoaders");
 
 var _assetLoaders = require("./loaderConfigs/assetLoaders");
@@ -46,7 +48,7 @@ function webpackConfigCreator(options) {
     module: {
       /* strictExportPresence for break the build when imported module not present in respective file */
       // strictExportPresence: true,
-      rules: [...(0, _jsLoaders.jsLoaders)(options), ...(0, _cssLoaders.cssLoaders)(options), (0, _configWebWorkerLoader.configWebWorkerLoader)(options), (0, _configHtmlTemplateLoader.configHtmlTemplateLoader)(options), ...(0, _assetLoaders.assetLoaders)(options), ...(0, _configCustomLoaders.configCustomLoaders)(options)]
+      rules: [...(0, _jsLoaders.jsLoaders)(options), ...(0, _tsLoaders.tsLoaders)(options), ...(0, _cssLoaders.cssLoaders)(options), (0, _configWebWorkerLoader.configWebWorkerLoader)(options), (0, _configHtmlTemplateLoader.configHtmlTemplateLoader)(options), ...(0, _assetLoaders.assetLoaders)(options), ...(0, _configCustomLoaders.configCustomLoaders)(options)]
     },
     plugins: (0, _plugins.plugins)(options),
     externals: (0, _externals.externals)(options),

package/lib/shared/fileUtils/watchRun.js

@@ -11,6 +11,8 @@ var _watcher = _interopRequireDefault(require("watcher"));
 
 var _runBabelForJSFile = require("../babel/runBabelForJSFile");
 
+var _runBabelForTsFile = require("../babel/runBabelForTsFile");
+
 var _runPostCssForCssFile = require("../postcss/runPostCssForCssFile");
 
 var _directoryIterator = require("./directoryIterator");
@@ -23,6 +25,8 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 
 const isJs = ext => ext === '.js';
 
+const isTs = ext => ext === '.ts' || ext === '.tsx';
+
 const isCss = ext => ext === '.css';
 
 function watchRun({
@@ -54,6 +58,13 @@ function watchRun({
         outputFile,
         options
       });
+    } else if (isTs(ext)) {
+      (0, _runBabelForTsFile.runBabelForTSFile)({
+        filename,
+        outputFile,
+        options,
+        mode
+      });
     } else {
       (0, _copyFile.copyFile)(filename, outputFile);
     }
@@ -81,7 +92,8 @@ function watchRun({
     const watcher = new _watcher.default(src, {
       recursive: true,
       ignoreInitial: true,
-      ignore: filename => filename.indexOf('__tests__') !== -1
+      ignore: filename => filename.indexOf('__tests__') !== -1 // remove the test cases 
+
     });
     watcher.on('all', (event, filename) => {
       if (event === 'unlink' || event === 'unlinkDir') {