catalyst-core 0.0.1-beta.2 → 0.0.1-beta.3

package/server/expressServer.js

@@ -0,0 +1,50 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _path = _interopRequireDefault(require("path"));
+var _express = _interopRequireDefault(require("express"));
+var _bodyParser = _interopRequireDefault(require("body-parser"));
+var _compression = _interopRequireDefault(require("compression"));
+var _cookieParser = _interopRequireDefault(require("cookie-parser"));
+var _expressStaticGzip = _interopRequireDefault(require("express-static-gzip"));
+var _renderer = _interopRequireDefault(require("./renderer"));
+var _server = require("@server/server.js");
+var _validator = require("./utils/validator");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const env = process.env.NODE_ENV || "development";
+const app = (0, _express.default)();
+
+// This middleware is being used to extract the body of the request
+app.use(_bodyParser.default.json());
+
+// This middleware has been added to accommodate “byetstream array”
+app.use(_bodyParser.default.raw({
+  type: "application/*"
+}));
+
+// This middleware is being used to parse cookies!
+app.use((0, _cookieParser.default)());
+
+// All the middlewares defined by the user will run here.
+if ((0, _validator.validateMiddleware)(_server.addMiddlewares)) (0, _server.addMiddlewares)(app);
+
+// The middleware will attempt to compress response bodies for all request that traverse through the middleware
+app.use((0, _compression.default)());
+
+// This endpoint will serve the built assets from the node server. The requests will be made to PUBLIC_STATIC_ASSET_PATH which has been defined in the application config.
+// expressStaticGzip will compress the assets.
+if (env === "production") {
+  app.use(process.env.PUBLIC_STATIC_ASSET_PATH, (0, _expressStaticGzip.default)(_path.default.join(process.env.src_path, `./${process.env.BUILD_OUTPUT_PATH}/public`), {
+    enableBrotli: true,
+    orderPreference: ["br", "gzip", "deflate"]
+  }));
+} else {
+  app.use(process.env.PUBLIC_STATIC_ASSET_PATH, _express.default.static(_path.default.join(process.env.src_path, `./${process.env.BUILD_OUTPUT_PATH}/public`)));
+}
+
+// This middleware handles document requests.
+app.use("*", _renderer.default);
+var _default = exports.default = app;

package/server/renderer/document/Body.js

@@ -4,33 +4,32 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Body = Body;
-var _react = require("react");
-var _react2 = _interopRequireDefault(_react);
+var _react = _interopRequireDefault(require("react"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 /**
  * Body component which will be used in page component
- * @param {object} initialState - redux store state
- * @param {object} statusCode - api config present in cache list
- * @param {object} firstFoldCss - user defined components for meta tags input
- * @param {object} firstFoldJS - user defined components for meta tags input
- * @param {object} jsx - user defined components for meta tags input
- * @param {object} fetcherData - router fetched data
+ * @param {object} initialState - initial state object for redux store
+ * @param {object} firstFoldCss - style elements extracted for initial page load
+ * @param {object} firstFoldJS - javascript elements extracted for initial page load
+ * @param {object} jsx - page jsx code
+ * @param {object} statusCode - document request status code
+ * @param {object} fetcherData - contains data from executing serverFetcher function
  */
 function Body(props) {
   const {
-    initialState,
-    statusCode,
-    firstFoldCss,
-    firstFoldJS,
-    jsx,
-    fetcherData
+    initialState = {},
+    statusCode = "",
+    firstFoldCss = "",
+    firstFoldJS = "",
+    jsx = "",
+    fetcherData = {}
   } = props;
-  return /*#__PURE__*/_react2.default.createElement("body", null, firstFoldCss, firstFoldJS, jsx, /*#__PURE__*/_react2.default.createElement("script", {
+  return /*#__PURE__*/_react.default.createElement("body", null, firstFoldCss, firstFoldJS, jsx, /*#__PURE__*/_react.default.createElement("script", {
     dangerouslySetInnerHTML: {
       __html: `
-                    window.__INITIAL_STATE__ = ${JSON.stringify(initialState)};
-                    window.__STATUS_CODE__ = ${statusCode};
-                    window.__ROUTER_INITIAL_DATA__ = ${JSON.stringify(fetcherData)};
+                    window.__INITIAL_STATE__ = ${JSON.stringify(initialState)}
+                    window.__STATUS_CODE__ = ${statusCode}
+                    window.__ROUTER_INITIAL_DATA__ = ${JSON.stringify(fetcherData)}
             `
     }
   }), props.children);

package/server/renderer/document/Head.js

@@ -4,8 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Head = Head;
-var _react = require("react");
-var _react2 = _interopRequireDefault(_react);
+var _react = _interopRequireDefault(require("react"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 /**
  * Head component which will be used in page rendering
@@ -25,18 +24,18 @@ function Head(props) {
     publicAssetPath,
     fetcherData
   } = props;
-  return /*#__PURE__*/_react2.default.createElement("head", null, /*#__PURE__*/_react2.default.createElement("meta", {
+  return /*#__PURE__*/_react.default.createElement("head", null, /*#__PURE__*/_react.default.createElement("meta", {
     charSet: "utf-8"
-  }), /*#__PURE__*/_react2.default.createElement("meta", {
+  }), /*#__PURE__*/_react.default.createElement("meta", {
     name: "viewport",
     content: "width=device-width, initial-scale=1"
-  }), publicAssetPath && /*#__PURE__*/_react2.default.createElement("link", {
+  }), publicAssetPath && /*#__PURE__*/_react.default.createElement("link", {
     rel: "preconnect",
     href: publicAssetPath
-  }), publicAssetPath && /*#__PURE__*/_react2.default.createElement("link", {
+  }), publicAssetPath && /*#__PURE__*/_react.default.createElement("link", {
     rel: "dns-prefetch",
     href: publicAssetPath
-  }), metaTagFunction && metaTagFunction(fetcherData), !isBot && pageJS, !isBot && /*#__PURE__*/_react2.default.createElement("style", {
+  }), metaTagFunction && metaTagFunction(fetcherData), !isBot && pageJS, !isBot && /*#__PURE__*/_react.default.createElement("style", {
     dangerouslySetInnerHTML: {
       __html: pageCss
     }

package/server/renderer/document/index.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 var _Head = require("./Head");
 Object.keys(_Head).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Head[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function () {
@@ -16,6 +17,7 @@ Object.keys(_Head).forEach(function (key) {
 var _Body = require("./Body");
 Object.keys(_Body).forEach(function (key) {
   if (key === "default" || key === "__esModule") return;
+  if (key in exports && exports[key] === _Body[key]) return;
   Object.defineProperty(exports, key, {
     enumerable: true,
     get: function () {

package/server/renderer/extract.js

@@ -5,24 +5,9 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.cacheCSS = cacheCSS;
 exports.cacheJS = cacheJS;
-exports.default = function (res, route) {
-  try {
-    const requestPath = route.path;
-    const cachedCss = fetchCachedCSS(requestPath);
-    const cachedJS = fetchCachedJS(requestPath);
-    if (cachedCss || cachedJS) {
-      res.locals.pageJS = cachedJS;
-      res.locals.pageCss = cachedCss;
-      return;
-    }
-  } catch (error) {
-    console.log("Error while reading lodable stats:");
-  }
-};
-var _path = require("path");
-var _path2 = _interopRequireDefault(_path);
-var _fs = require("fs");
-var _fs2 = _interopRequireDefault(_fs);
+exports.default = _default;
+var _path = _interopRequireDefault(require("path"));
+var _fs = _interopRequireDefault(require("fs"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 /**
  * Stores css chunks styles into cache in string format
@@ -39,11 +24,13 @@ function cacheCSS(key, data) {
       data.map(assetChunk => {
         const assetPathArr = assetChunk.key.split("/");
         const assetName = assetPathArr[assetPathArr.length - 1];
-        const ext = _path2.default.extname(assetName);
-        if (ext === ".css") pageCss += _fs2.default.readFileSync(_path2.default.resolve(process.env.src_path, `${process.env.OUTPUT_PATH}/public/`, assetName));
+        const ext = _path.default.extname(assetName);
+        if (ext === ".css") pageCss += _fs.default.readFileSync(_path.default.resolve(process.env.src_path, `${process.env.BUILD_OUTPUT_PATH}/public`, assetName));
       });
     } catch (error) {
-      console.log("=====> Error While Extracting The Chunk:");
+      if (process.env.NODE_ENV == "development") {
+        console.log("Error While Extracting The Chunk: ", _path.default.resolve(process.env.src_path, `${process.env.BUILD_OUTPUT_PATH}/public`, assetName));
+      }
     }
   }
   process.cssCache[key] = pageCss;
@@ -64,7 +51,7 @@ function cacheJS(key, data) {
 /**
  * returns cached css
  * @param {string} key - router path
- * @return {string} - cached css 
+ * @return {string} - cached css
  */
 function fetchCachedCSS(key) {
   return process.cssCache && process.cssCache[key] ? process.cssCache[key] : null;
@@ -73,7 +60,7 @@ function fetchCachedCSS(key) {
 /**
  * returns cached js
  * @param {string} key - router path
- * @return {string} - cached js 
+ * @return {string} - cached js
  */
 function fetchCachedJS(key) {
   return process.jsCache && process.jsCache[key] ? process.jsCache[key] : null;
@@ -83,4 +70,18 @@ function fetchCachedJS(key) {
  * stores css and js in cache
  * @param {object} res - response object
  * @param {string} route - route path
- */
+ */
+function _default(res, route) {
+  try {
+    const requestPath = route.path;
+    const cachedCss = fetchCachedCSS(requestPath);
+    const cachedJS = fetchCachedJS(requestPath);
+    if (cachedCss || cachedJS) {
+      res.locals.pageJS = cachedJS;
+      res.locals.pageCss = cachedCss;
+      return;
+    }
+  } catch (error) {
+    console.log("Error while caching your assets.");
+  }
+}