oc-template-react-compiler 5.2.1 → 6.0.0

package/index.js

@@ -1,11 +0,0 @@
-"use strict";
-
-const compile = require("./lib/compile");
-const template = require("oc-template-react");
-
-module.exports = {
-  compile,
-  getCompiledTemplate: template.getCompiledTemplate,
-  getInfo: template.getInfo,
-  render: template.render
-};

package/lib/compile.js

@@ -1,26 +0,0 @@
-"use strict";
-
-const createCompile = require("oc-generic-template-compiler").createCompile;
-const compileStatics = require("oc-statics-compiler");
-const getInfo = require("oc-template-react").getInfo;
-
-const compileServer = require("./compileServer");
-const compileView = require("./compileView");
-
-// OPTIONS
-// =======
-// componentPath
-// componentPackage,
-// logger,
-// minify
-// ocPackage
-// publishPath
-// verbose,
-// watch,
-// production
-module.exports = createCompile({
-  compileServer,
-  compileStatics,
-  compileView,
-  getInfo
-});

package/lib/compileServer.js

@@ -1,100 +0,0 @@
-"use strict";
-
-const async = require("async");
-const fs = require("fs-extra");
-const hashBuilder = require("oc-hash-builder");
-const MemoryFS = require("memory-fs");
-const path = require("path");
-const reactComponentWrapper = require("oc-react-component-wrapper");
-
-const {
-  compiler,
-  configurator: { server: webpackConfigurator }
-} = require("./to-abstract-base-template-utils/oc-webpack");
-const higherOrderServerTemplate = require("./higherOrderServerTemplate");
-
-module.exports = (options, callback) => {
-  const serverFileName = options.componentPackage.oc.files.data;
-  let serverPath = path.join(options.componentPath, serverFileName);
-  if (process.platform === "win32") {
-    serverPath = serverPath.split("\\").join("\\\\");
-  }
-  const publishFileName = options.publishFileName || "server.js";
-  const publishPath = options.publishPath;
-  const stats = options.verbose ? "verbose" : "errors-only";
-  const dependencies = options.componentPackage.dependencies || {};
-  const componentName = options.componentPackage.name;
-  const componentVersion = options.componentPackage.version;
-  const production = options.production;
-
-  const higherOrderServerContent = higherOrderServerTemplate({
-    serverPath,
-    componentName,
-    componentVersion,
-    bundleHashKey: options.compiledViewInfo.bundle.hashKey
-  });
-  const tempFolder = path.join(serverPath, "../temp");
-  const higherOrderServerPath = path.join(
-    tempFolder,
-    "__oc_higherOrderServer.js"
-  );
-
-  const config = webpackConfigurator({
-    serverPath: higherOrderServerPath,
-    publishFileName,
-    dependencies,
-    stats,
-    production
-  });
-
-  async.waterfall(
-    [
-      next =>
-        fs.outputFile(higherOrderServerPath, higherOrderServerContent, next),
-      next => compiler(config, next),
-      (data, next) => {
-        const basePath = path.join(serverPath, "../temp/build");
-        const memory = new MemoryFS(data);
-        const getCompiled = fileName =>
-          memory.readFileSync(`${basePath}/${fileName}`, "UTF8");
-
-        return fs.ensureDir(publishPath, err => {
-          if (err) return next(err);
-          const result = { "server.js": getCompiled(config.output.filename) };
-
-          if (!production) {
-            try {
-              result["server.js.map"] = getCompiled(
-                `${config.output.filename}.map`
-              );
-            } catch (e) {
-              // skip sourcemap if it doesn't exist
-            }
-          }
-
-          next(null, result);
-        });
-      },
-      (compiledFiles, next) =>
-        async.eachOf(
-          compiledFiles,
-          (fileContent, fileName, next) =>
-            fs.writeFile(path.join(publishPath, fileName), fileContent, next),
-          err =>
-            next(
-              err,
-              err
-                ? null
-                : {
-                    type: "node.js",
-                    hashKey: hashBuilder.fromString(
-                      compiledFiles[publishFileName]
-                    ),
-                    src: publishFileName
-                  }
-            )
-        )
-    ],
-    (err, data) => fs.remove(tempFolder, err2 => callback(err, data))
-  );
-};

package/lib/compileView.js

@@ -1,135 +0,0 @@
-"use strict";
-
-const async = require("async");
-const fs = require("fs-extra");
-const hashBuilder = require("oc-hash-builder");
-const MemoryFS = require("memory-fs");
-const minifyFile = require("oc-minify-file");
-const ocViewWrapper = require("oc-view-wrapper");
-const path = require("path");
-const reactComponentWrapper = require("oc-react-component-wrapper");
-const strings = require("oc-templates-messages");
-
-const {
-  compiler,
-  configurator: { client: webpackConfigurator }
-} = require("./to-abstract-base-template-utils/oc-webpack");
-
-const fontFamilyUnicodeParser = require("./to-abstract-base-template-utils/font-family-unicode-parser");
-const reactOCProviderTemplate = require("./reactOCProviderTemplate");
-const viewTemplate = require("./viewTemplate");
-
-module.exports = (options, callback) => {
-  const viewFileName = options.componentPackage.oc.files.template.src;
-  let viewPath = path.join(options.componentPath, viewFileName);
-  if (process.platform === "win32") {
-    viewPath = viewPath.split("\\").join("\\\\");
-  }
-  const publishPath = options.publishPath;
-  const publishFileName = options.publishFileName || "template.js";
-  const componentPackage = options.componentPackage;
-  const { getInfo } = require("../index");
-  const externals = componentPackage.oc.files.template.externals || getInfo().externals;
-  const production = options.production;
-
-  const reactOCProviderContent = reactOCProviderTemplate({ viewPath });
-  const reactOCProviderName = "reactOCProvider.js";
-  const reactOCProviderPath = path.join(
-    publishPath,
-    "temp",
-    reactOCProviderName
-  );
-
-  const compile = (options, cb) => {
-    const config = webpackConfigurator({
-      viewPath: options.viewPath,
-      externals: externals.reduce((externals, dep) => {
-        externals[dep.name] = dep.global;
-        return externals;
-      }, {}),
-      publishFileName,
-      production,
-      buildIncludes: componentPackage.oc.files.template.buildIncludes || []
-    });
-    compiler(config, (err, data) => {
-      if (err) {
-        return cb(err);
-      }
-
-      const memoryFs = new MemoryFS(data);
-      const bundle = memoryFs.readFileSync(
-        `/build/${config.output.filename}`,
-        "UTF8"
-      );
-
-      const bundleHash = hashBuilder.fromString(bundle);
-      const bundleName = "react-component";
-      const bundlePath = path.join(publishPath, `${bundleName}.js`);
-      const wrappedBundle = reactComponentWrapper(bundleHash, bundle);
-      fs.outputFileSync(bundlePath, wrappedBundle);
-
-      let css = null;
-      if (data.build["main.css"]) {
-        // This is an awesome hack by KimTaro that will blow your mind.
-        // Remove it once this get merged: https://github.com/webpack-contrib/css-loader/pull/523
-        css = fontFamilyUnicodeParser(
-          memoryFs.readFileSync(`/build/main.css`, "UTF8")
-        );
-
-        // We convert single quotes to double quotes in order to
-        // support the viewTemplate's string interpolation
-        css = minifyFile(".css", css).replace(/\'/g, '"');
-        const cssPath = path.join(publishPath, `styles.css`);
-        fs.outputFileSync(cssPath, css);
-      }
-
-      const reactRoot = `oc-reactRoot-${componentPackage.name}`;
-      const templateString = viewTemplate({
-        reactRoot,
-        css,
-        externals,
-        bundleHash,
-        bundleName
-      });
-
-      const templateStringCompressed = production
-        ? templateString.replace(/\s+/g, " ")
-        : templateString;
-      const hash = hashBuilder.fromString(templateStringCompressed);
-      const view = ocViewWrapper(hash, templateStringCompressed);
-      return cb(null, {
-        template: { view, hash },
-        bundle: { hash: bundleHash }
-      });
-    });
-  };
-
-  async.waterfall(
-    [
-      next => fs.outputFile(reactOCProviderPath, reactOCProviderContent, next),
-      next => compile({ viewPath: reactOCProviderPath }, next),
-      (compiled, next) =>
-        fs.remove(reactOCProviderPath, err => next(err, compiled)),
-      (compiled, next) => fs.ensureDir(publishPath, err => next(err, compiled)),
-      (compiled, next) =>
-        fs.writeFile(
-          path.join(publishPath, publishFileName),
-          compiled.template.view,
-          err => next(err, compiled)
-        )
-    ],
-    (err, compiled) => {
-      if (err) {
-        return callback(strings.errors.compilationFailed(viewFileName, err));
-      }
-      callback(null, {
-        template: {
-          type: options.componentPackage.oc.files.template.type,
-          hashKey: compiled.template.hash,
-          src: publishFileName
-        },
-        bundle: { hashKey: compiled.bundle.hash }
-      });
-    }
-  );
-};

package/lib/higherOrderServerTemplate.js

@@ -1,32 +0,0 @@
-const higherOrderServerTemplate = ({
-  serverPath,
-  bundleHashKey,
-  componentName,
-  componentVersion
-}) => `
-import { data as dataProvider } from '${serverPath}';
-export const data = (context, callback) => {
-  dataProvider(context, (error, model) => {
-    if (error) {
-      return callback(error);
-    }
-    const props = Object.assign({}, model, {
-      _staticPath: context.staticPath,
-      _baseUrl: context.baseUrl,
-      _componentName: "${componentName}",
-      _componentVersion: "${componentVersion}"
-    });
-    const srcPathHasProtocol = context.staticPath.indexOf("http") === 0;
-    const srcPath = srcPathHasProtocol ? context.staticPath : ("https:" + context.staticPath);
-    return callback(null, Object.assign({}, {
-      reactComponent: {
-        key: "${bundleHashKey}",
-        src: srcPath + "react-component.js",
-        props
-      }
-    }));
-  });
-}
-`;
-
-module.exports = higherOrderServerTemplate;

package/lib/reactOCProviderTemplate.js

@@ -1,54 +0,0 @@
-const reactOCProviderTemplate = ({ viewPath }) => `
-  import PropTypes from 'prop-types';
-  import React from 'react';
-  import View from '${viewPath}';
-
-  class OCProvider extends React.Component {
-    componentDidMount(){
-      const { _staticPath, _baseUrl, _componentName, _componentVersion, ...rest } = this.props;
-      window.oc.events.fire('oc:componentDidMount',  rest);
-    }
-
-    getChildContext() {
-      const getData = (parameters, cb) => {
-        return window.oc.getData({
-          name: this.props._componentName,
-          version: this.props._componentVersion,
-          baseUrl: this.props._baseUrl,
-          parameters
-        }, (err, data) => {
-          if (err) {
-            return cb(err);
-          }
-          const { _staticPath, _baseUrl, _componentName, _componentVersion, ...rest } = data.reactComponent.props; 
-          cb(null, rest, data.reactComponent.props);
-        });
-      };
-      const getSetting = setting => {
-        const settingHash = {
-          name: this.props._componentName,
-          version: this.props._componentVersion,
-          baseUrl: this.props._baseUrl,
-          staticPath: this.props._staticPath
-        };
-        return settingHash[setting];
-      };
-      return { getData, getSetting };
-    }
-
-    render() {
-      const { _staticPath, _baseUrl, _componentName, _componentVersion, ...rest } = this.props;        
-      return (
-        <View {...rest} />
-      );
-    }
-  }
-
-  OCProvider.childContextTypes = {
-    getData: PropTypes.func,
-    getSetting: PropTypes.func
-  };
-  export default OCProvider
-`;
-
-module.exports = reactOCProviderTemplate;

package/lib/to-abstract-base-template-utils/font-family-unicode-parser.js

@@ -1,25 +0,0 @@
-const RE_FONT_FAMILY = /font-family\s*:\s*([^;\n]+)[;\n]/g;
-const RE_FONT_NAMES = /(?:(?:'|(?:\\"))?([(?:\\\\)\w\d _-]+)(?:'|(?:\\"))?(,\s*)?)/g;
-const RE_DOUBLE_COUTE = /"/g;
-const RE_SPACE = /[ ]+/g;
-const RE_UNICODE = /\\([\d\w]{4})/g;
-
-module.exports = function(source) {
-  source = source.replace(RE_FONT_FAMILY, (str, fontNames) => {
-    const strFontNames = fontNames
-      .replace(RE_DOUBLE_COUTE, "'")
-      .replace(RE_FONT_NAMES, (match, fontName, sep) => {
-        if (match.includes("'")) {
-          const replacement = fontName
-            .replace(RE_SPACE, " ")
-            .replace(RE_UNICODE, (m, unicode) =>
-              String.fromCharCode(parseInt(unicode, 16))
-            );
-          return `'${replacement}'${sep || ""}`;
-        }
-        return match;
-      });
-    return `font-family: ${strFontNames};`;
-  });
-  return source;
-};

package/lib/to-abstract-base-template-utils/oc-webpack/index.js

@@ -1,9 +0,0 @@
-"use strict";
-
-const compiler = require("./lib/compiler");
-const configurator = require("./lib/configurator");
-
-module.exports = {
-  compiler,
-  configurator
-};

package/lib/to-abstract-base-template-utils/oc-webpack/lib/compiler/index.js

@@ -1,42 +0,0 @@
-"use strict";
-
-const MemoryFS = require("memory-fs");
-const webpack = require("webpack");
-
-const memoryFs = new MemoryFS();
-
-module.exports = function compiler(config, callback) {
-  const logger = config.logger;
-  delete config.logger;
-
-  const compiler = webpack(config);
-  compiler.outputFileSystem = memoryFs;
-
-  compiler.run((error, stats) => {
-    let softError;
-    let warning;
-
-    // handleFatalError
-    if (error) {
-      return callback(error);
-    }
-
-    const info = stats.toJson();
-    // handleSoftErrors
-    if (stats.hasErrors()) {
-      softError = info.errors.toString();
-      return callback(softError);
-    }
-    // handleWarnings
-    if (stats.hasWarnings()) {
-      warning = info.warnings.toString();
-    }
-
-    const log = stats.toString(config.stats || "errors-only");
-
-    if (log) {
-      logger.log(log);
-    }
-    callback(null, memoryFs.data);
-  });
-};

package/lib/to-abstract-base-template-utils/oc-webpack/lib/configurator/client/index.js

@@ -1,120 +0,0 @@
-"use strict";
-
-const MiniCssExtractPlugin = require("mini-css-extract-plugin");
-const MinifyPlugin = require("babel-minify-webpack-plugin");
-const path = require("path");
-const webpack = require("webpack");
-const _ = require("lodash");
-
-const createExcludeRegex = require("../createExcludeRegex");
-
-module.exports = options => {
-  const buildPath = options.buildPath || "/build";
-  const production = options.production;
-  const buildIncludes = options.buildIncludes.concat(
-    "oc-template-react-compiler/utils"
-  );
-  const excludeRegex = createExcludeRegex(buildIncludes);
-  const localIdentName = !production
-    ? "oc__[path][name]-[ext]__[local]__[hash:base64:8]"
-    : "[local]__[hash:base64:8]";
-
-  const cssLoader = {
-    test: /\.css$/,
-    use: [
-      MiniCssExtractPlugin.loader,
-      {
-        loader: require.resolve("css-loader"),
-        options: {
-          importLoaders: 1,
-          modules: true,
-          localIdentName,
-          camelCase: true
-        }
-      },
-      {
-        loader: require.resolve("postcss-loader"),
-        options: {
-          ident: "postcss",
-          plugins: [
-            require("postcss-import"),
-            require("postcss-extend"),
-            require("postcss-icss-values"),
-            require("autoprefixer")
-          ]
-        }
-      }
-    ]
-  };
-
-  let plugins = [
-    new MiniCssExtractPlugin({
-      filename: "[name].css",
-      allChunks: true,
-      ignoreOrder: true
-    }),
-    new webpack.DefinePlugin({
-      "process.env.NODE_ENV": JSON.stringify(
-        production ? "production" : "development"
-      )
-    })
-  ];
-  if (production) {
-    plugins = plugins.concat(new MinifyPlugin());
-  }
-
-  const cacheDirectory = !production;
-  const polyfills = ["Object.assign"];
-
-  return {
-    mode: production ? "production" : "development",
-    optimization: {
-      // https://webpack.js.org/configuration/optimization/
-      // Override production mode optimization for minification
-      // As it currently breakes the build, still rely on babel-minify-webpack-plugin instead
-      minimize: false
-    },
-    entry: options.viewPath,
-    output: {
-      path: buildPath,
-      filename: options.publishFileName
-    },
-    externals: _.omit(options.externals, polyfills),
-    module: {
-      rules: [
-        cssLoader,
-        {
-          test: /\.jsx?$/,
-          exclude: excludeRegex,
-          use: [
-            {
-              loader: require.resolve("babel-loader"),
-              options: {
-                cacheDirectory,
-                babelrc: false,
-                presets: [
-                  [
-                    require.resolve("babel-preset-env"),
-                    { modules: false, loose: true }
-                  ],
-                  [require.resolve("babel-preset-react")]
-                ],
-                plugins: [
-                  [require.resolve("babel-plugin-transform-object-rest-spread")]
-                ]
-              }
-            }
-          ]
-        }
-      ]
-    },
-    plugins,
-    resolve: {
-      alias: {
-        react: path.join(__dirname, "../../node_modules/react"),
-        "react-dom": path.join(__dirname, "../../node_modules/react-dom"),
-        "prop-types": path.join(__dirname, "../../node_modules/prop-types")
-      }
-    }
-  };
-};

package/lib/to-abstract-base-template-utils/oc-webpack/lib/configurator/createExcludeRegex.js

@@ -1,6 +0,0 @@
-"use strict";
-
-const createExcludeRegex = buildIncludes =>
-  new RegExp(`node_modules\/(?!(${buildIncludes.join("|")}))`);
-
-module.exports = createExcludeRegex;

package/lib/to-abstract-base-template-utils/oc-webpack/lib/configurator/index.js

@@ -1,9 +0,0 @@
-"use strict";
-
-const client = require("./client");
-const server = require("./server");
-
-module.exports = {
-  client,
-  server
-};

package/lib/to-abstract-base-template-utils/oc-webpack/lib/configurator/server/index.js

@@ -1,93 +0,0 @@
-/*jshint camelcase:false */
-"use strict";
-
-const MinifyPlugin = require("babel-minify-webpack-plugin");
-const externalDependenciesHandlers = require("oc-external-dependencies-handler");
-const path = require("path");
-const webpack = require("webpack");
-
-module.exports = function webpackConfigGenerator(options) {
-  const production =
-    options.production !== undefined ? options.production : "true";
-
-  const sourceMaps = !production;
-  const devtool = sourceMaps ? "#source-map" : "";
-
-  const jsLoaders = [
-    {
-      loader: require.resolve("babel-loader"),
-      options: {
-        cacheDirectory: true,
-        retainLines: true,
-        sourceMaps,
-        sourceRoot: path.join(options.serverPath, ".."),
-        babelrc: false,
-        presets: [
-          [
-            require.resolve("babel-preset-env"),
-            {
-              modules: false,
-              targets: {
-                node: 6
-              }
-            }
-          ],
-          [
-            require.resolve("babel-preset-react")
-          ]
-        ],
-        plugins: [
-          [require.resolve("babel-plugin-transform-object-rest-spread")]
-        ]
-      }
-    }
-  ];
-
-  const plugins = [
-    new webpack.DefinePlugin({
-      "process.env.NODE_ENV": JSON.stringify(
-        production ? "production" : "development"
-      )
-    })
-  ];
-
-  if (production) {
-    jsLoaders.unshift({
-      loader: require.resolve("infinite-loop-loader")
-    });
-    plugins.unshift(new MinifyPlugin());
-  }
-
-  return {
-    mode: production ? "production" : "development",
-    optimization: {
-      // https://webpack.js.org/configuration/optimization/
-      // Override production mode optimization for minification
-      // As it currently breakes the build, still rely on babel-minify-webpack-plugin instead
-      minimize: false
-    },
-    devtool,
-    entry: options.serverPath,
-    target: "node",
-    output: {
-      path: path.join(options.serverPath, "../build"),
-      filename: options.publishFileName,
-      libraryTarget: "commonjs2",
-      devtoolModuleFilenameTemplate: "[absolute-resource-path]",
-      devtoolFallbackModuleFilenameTemplate: "[absolute-resource-path]?[hash]"
-    },
-    externals: externalDependenciesHandlers(options.dependencies),
-    module: {
-      rules: [
-        {
-          test: /\.js$/,
-          exclude: /node_modules/,
-          use: jsLoaders
-        }
-      ]
-    },
-    plugins,
-    logger: options.logger || console,
-    stats: options.stats
-  };
-};