@modern-js/runtime 2.0.0-beta.0 → 2.0.0-beta.1

package/dist/js/treeshaking/ssr/serverRender/renderToStream/template.js

@@ -2,28 +2,21 @@ import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
 import { buildShellAfterTemplate } from "./buildTemplate.after";
 import { buildShellBeforeTemplate } from "./bulidTemplate.before";
 var HTML_SEPARATOR = '<!--<?- html ?>-->';
-export function createTemplates(context) {
-  var getTemplates = function getTemplates() {
-    var _ref = context.ssrContext,
-        template = _ref.template;
-
-    var _ref2 = template.split(HTML_SEPARATOR) || [],
-        _ref3 = _slicedToArray(_ref2, 2),
-        _ref3$ = _ref3[0],
-        beforeAppTemplate = _ref3$ === void 0 ? '' : _ref3$,
-        _ref3$2 = _ref3[1],
-        afterAppHtmlTemplate = _ref3$2 === void 0 ? '' : _ref3$2; // templates injected some variables
-
-
-    var builtBeforeTemplate = buildShellBeforeTemplate(beforeAppTemplate);
-    var builtAfterTemplate = buildShellAfterTemplate(afterAppHtmlTemplate, {
-      context: context
-    });
-    return {
-      shellBefore: builtBeforeTemplate,
-      shellAfter: builtAfterTemplate
-    };
+export var getTemplates = function getTemplates(context, renderLevel) {
+  var ssrContext = context.ssrContext;
+  var _ref = ssrContext.template.split(HTML_SEPARATOR) || [],
+    _ref2 = _slicedToArray(_ref, 2),
+    _ref2$ = _ref2[0],
+    beforeAppTemplate = _ref2$ === void 0 ? '' : _ref2$,
+    _ref2$2 = _ref2[1],
+    afterAppHtmlTemplate = _ref2$2 === void 0 ? '' : _ref2$2;
+  var builtBeforeTemplate = buildShellBeforeTemplate(beforeAppTemplate, context);
+  var builtAfterTemplate = buildShellAfterTemplate(afterAppHtmlTemplate, {
+    ssrContext: ssrContext,
+    renderLevel: renderLevel
+  });
+  return {
+    shellBefore: builtBeforeTemplate,
+    shellAfter: builtAfterTemplate
   };
-
-  return getTemplates;
-}
+};

package/dist/js/treeshaking/ssr/serverRender/renderToString/entry.js

@@ -11,11 +11,11 @@ import ReactHelmet from 'react-helmet';
 import helmetReplace from "../helmet";
 import { RenderLevel } from "../types";
 import { time } from "../utils";
+import _prefetch from "../../prefetch";
 import { toFragments } from "./template";
 import { reduce } from "./reduce";
 import * as loadableRenderer from "./loadable";
 import * as styledComponentRenderer from "./styledComponent";
-
 var buildTemplateData = function buildTemplateData(context, data, renderLevel) {
   var request = context.request;
   return {
@@ -34,32 +34,22 @@ var buildTemplateData = function buildTemplateData(context, data, renderLevel) {
     renderLevel: renderLevel
   };
 };
-
 var Entry = /*#__PURE__*/function () {
   function Entry(options) {
     _classCallCheck(this, Entry);
-
     _defineProperty(this, "entryName", void 0);
-
     _defineProperty(this, "result", void 0);
-
     _defineProperty(this, "metrics", void 0);
-
     _defineProperty(this, "logger", void 0);
-
     _defineProperty(this, "App", void 0);
-
     _defineProperty(this, "fragments", void 0);
-
     _defineProperty(this, "pluginConfig", void 0);
-
     _defineProperty(this, "host", void 0);
-
     var ctx = options.ctx,
-        config = options.config;
+      config = options.config;
     var entryName = ctx.entryName,
-        template = ctx.template,
-        host = ctx.request.host;
+      template = ctx.template,
+      host = ctx.request.host;
     this.fragments = toFragments(template, entryName);
     this.entryName = entryName;
     this.host = host;
@@ -76,62 +66,48 @@ var Entry = /*#__PURE__*/function () {
       }
     };
   }
-
   _createClass(Entry, [{
     key: "renderToHtml",
     value: function () {
       var _renderToHtml = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(context) {
         var ssrContext, prefetchData, html, templateData, SSRData, _iterator, _step, fragment, helmetData;
-
         return _regeneratorRuntime().wrap(function _callee$(_context) {
           while (1) {
             switch (_context.prev = _context.next) {
               case 0:
                 ssrContext = context.ssrContext;
-
                 if (!ssrContext.redirection.url) {
                   _context.next = 3;
                   break;
                 }
-
                 return _context.abrupt("return", '');
-
               case 3:
                 _context.next = 5;
                 return this.prefetch(context);
-
               case 5:
                 prefetchData = _context.sent;
-
                 if (!ssrContext.redirection.url) {
                   _context.next = 8;
                   break;
                 }
-
                 return _context.abrupt("return", '');
-
               case 8:
                 if (this.result.renderLevel >= RenderLevel.SERVER_PREFETCH) {
                   this.result.html = this.renderToString(context);
                 }
-
                 if (!ssrContext.redirection.url) {
                   _context.next = 11;
                   break;
                 }
-
                 return _context.abrupt("return", '');
-
               case 11:
                 html = '';
                 templateData = buildTemplateData(ssrContext, prefetchData, this.result.renderLevel);
                 SSRData = this.getSSRDataScript(templateData);
                 _iterator = _createForOfIteratorHelper(this.fragments);
-
                 try {
                   for (_iterator.s(); !(_step = _iterator.n()).done;) {
                     fragment = _step.value;
-
                     if (fragment.isVariable && fragment.content === 'SSRDataScript') {
                       html += fragment.getValue(SSRData);
                     } else {
@@ -143,10 +119,8 @@ var Entry = /*#__PURE__*/function () {
                 } finally {
                   _iterator.f();
                 }
-
                 helmetData = ReactHelmet.renderStatic();
                 return _context.abrupt("return", helmetData ? helmetReplace(html, helmetData) : html);
-
               case 18:
               case "end":
                 return _context.stop();
@@ -154,73 +128,50 @@ var Entry = /*#__PURE__*/function () {
           }
         }, _callee, this);
       }));
-
       function renderToHtml(_x) {
         return _renderToHtml.apply(this, arguments);
       }
-
       return renderToHtml;
     }()
   }, {
     key: "prefetch",
     value: function () {
-      var _prefetch = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(context) {
-        var prefetch, prefetchData, end, prefetchCost;
+      var _prefetch2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(context) {
+        var prefetchData, end, prefetchCost;
         return _regeneratorRuntime().wrap(function _callee2$(_context2) {
           while (1) {
             switch (_context2.prev = _context2.next) {
               case 0:
-                prefetch = this.App.prefetch;
                 end = time();
-                _context2.prev = 2;
-
-                if (!prefetch) {
-                  _context2.next = 9;
-                  break;
-                }
-
-                _context2.next = 6;
-                return prefetch(context);
-
-              case 6:
-                _context2.t0 = _context2.sent;
-                _context2.next = 10;
-                break;
-
-              case 9:
-                _context2.t0 = null;
-
-              case 10:
-                prefetchData = _context2.t0;
+                _context2.prev = 1;
+                _context2.next = 4;
+                return _prefetch(this.App, context);
+              case 4:
+                prefetchData = _context2.sent;
                 this.result.renderLevel = RenderLevel.SERVER_PREFETCH;
                 prefetchCost = end();
                 this.logger.debug("App Prefetch cost = %d ms", prefetchCost);
                 this.metrics.emitTimer('app.prefetch.cost', prefetchCost);
-                _context2.next = 22;
+                _context2.next = 16;
                 break;
-
-              case 17:
-                _context2.prev = 17;
-                _context2.t1 = _context2["catch"](2);
+              case 11:
+                _context2.prev = 11;
+                _context2.t0 = _context2["catch"](1);
                 this.result.renderLevel = RenderLevel.CLIENT_RENDER;
-                this.logger.error('App Prefetch Render', _context2.t1);
+                this.logger.error('App Prefetch Render', _context2.t0);
                 this.metrics.emitCounter('app.prefetch.render.error', 1);
-
-              case 22:
+              case 16:
                 return _context2.abrupt("return", prefetchData || {});
-
-              case 23:
+              case 17:
               case "end":
                 return _context2.stop();
             }
           }
-        }, _callee2, this, [[2, 17]]);
+        }, _callee2, this, [[1, 11]]);
       }));
-
       function prefetch(_x2) {
-        return _prefetch.apply(this, arguments);
+        return _prefetch2.apply(this, arguments);
       }
-
       return prefetch;
     }()
   }, {
@@ -229,7 +180,6 @@ var Entry = /*#__PURE__*/function () {
       var html = '';
       var end = time();
       var ssrContext = context.ssrContext;
-
       try {
         var App = /*#__PURE__*/React.createElement(this.App, {
           context: Object.assign(context, {
@@ -254,7 +204,6 @@ var Entry = /*#__PURE__*/function () {
         this.logger.error('App Render To HTML', e);
         this.metrics.emitCounter('app.render.html.error', 1);
       }
-
       return html;
     }
   }, {
@@ -267,8 +216,6 @@ var Entry = /*#__PURE__*/function () {
       };
     }
   }]);
-
   return Entry;
 }();
-
 export { Entry as default };

package/dist/js/treeshaking/ssr/serverRender/renderToString/index.js

@@ -6,8 +6,8 @@ import { time } from "../utils";
 import SSREntry from "./entry";
 export var render = function render(_ref) {
   var App = _ref.App,
-      context = _ref.context,
-      config = _ref.config;
+    context = _ref.context,
+    config = _ref.config;
   var ssrContext = context.ssrContext;
   return run(ssrContext.request.headers, /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
     var entry, end, html, cost, cacheConfig;
@@ -24,20 +24,16 @@ export var render = function render(_ref) {
             end = time();
             _context.next = 5;
             return entry.renderToHtml(context);
-
           case 5:
             html = _context.sent;
             cost = end();
             entry.logger.info('App Render Total cost = %d ms', cost);
             entry.metrics.emitTimer('app.render.cost', cost);
             cacheConfig = PreRender.config();
-
             if (cacheConfig) {
               context.ssrContext.cacheConfig = cacheConfig;
             }
-
             return _context.abrupt("return", html);
-
           case 12:
           case "end":
             return _context.stop();

package/dist/js/treeshaking/ssr/serverRender/renderToString/loadable.js

@@ -2,26 +2,21 @@ import _createForOfIteratorHelper from "@babel/runtime/helpers/esm/createForOfIt
 import { ChunkExtractor } from '@loadable/server';
 import { isCrossOrigin } from "../../utils";
 import { getLoadableScripts } from "../utils";
-
 var extname = function extname(uri) {
   if (typeof uri !== 'string' || !uri.includes('.')) {
     return '';
   }
-
   return ".".concat(uri === null || uri === void 0 ? void 0 : uri.split('.').pop()) || '';
 };
-
 export var toHtml = function toHtml(jsx, renderer, next) {
   var stats = renderer.stats,
-      chunksMap = renderer.result.chunksMap,
-      host = renderer.host,
-      _renderer$config = renderer.config,
-      config = _renderer$config === void 0 ? {} : _renderer$config;
-
+    chunksMap = renderer.result.chunksMap,
+    host = renderer.host,
+    _renderer$config = renderer.config,
+    config = _renderer$config === void 0 ? {} : _renderer$config;
   if (!stats || chunksMap.js) {
     return next(jsx);
   }
-
   var extractor = new ChunkExtractor({
     stats: stats,
     entrypoints: [renderer.entryName]
@@ -29,23 +24,18 @@ export var toHtml = function toHtml(jsx, renderer, next) {
   var html = next(extractor.collectChunks(jsx));
   var chunks = extractor.getChunkAssets(extractor.chunks);
   chunksMap.js = (chunksMap.js || '') + getLoadableScripts(extractor);
-
   var _iterator = _createForOfIteratorHelper(chunks),
-      _step;
-
+    _step;
   try {
     for (_iterator.s(); !(_step = _iterator.n()).done;) {
       var v = _step.value;
       var fileType = extname(v.url).slice(1);
-
       if (fileType === 'js') {
         var props = [];
         var crossorigin = config.crossorigin;
-
         if (crossorigin && isCrossOrigin(v.url, host)) {
           props.push("crossorigin=\"".concat(crossorigin === true ? 'anonymous' : crossorigin, "\""));
         }
-
         chunksMap[fileType] += "<script src=\"".concat(v.url, "\" ").concat(props.join(' '), "></script>");
       } else if (fileType === 'css') {
         chunksMap[fileType] += "<link href=\"".concat(v.url, "\" rel=\"stylesheet\" />");
@@ -56,6 +46,5 @@ export var toHtml = function toHtml(jsx, renderer, next) {
   } finally {
     _iterator.f();
   }
-
   return html;
 };

package/dist/js/treeshaking/ssr/serverRender/renderToString/reduce.js

@@ -1,11 +1,9 @@
 export function reduce(jsx, renderer, middleware) {
   var index = 0;
-
   var createNext = function createNext() {
     return function (App) {
       return middleware[index++](App, renderer, createNext());
     };
   };
-
   return createNext()(jsx);
 }

package/dist/js/treeshaking/ssr/serverRender/renderToString/template.js

@@ -12,34 +12,24 @@ var ENCODE_HTML_RULES = {
   "'": '''
 };
 var MATCH_HTML = /[&<>'"]/g;
-
 function encodeChar(c) {
   return ENCODE_HTML_RULES[c] || c;
 }
-
 function escape(str) {
   return str.replace(MATCH_HTML, encodeChar);
 }
-
 export var Fragment = /*#__PURE__*/function () {
   function Fragment(template) {
     _classCallCheck(this, Fragment);
-
     _defineProperty(this, "isVariable", void 0);
-
     _defineProperty(this, "content", void 0);
-
     _defineProperty(this, "filters", void 0);
-
     _defineProperty(this, "path", void 0);
-
     var match = VARIABLE_REG_EXP.exec(template);
-
     if (match) {
       var _match = _slicedToArray(match, 3),
-          filterFlag = _match[1],
-          content = _match[2];
-
+        filterFlag = _match[1],
+        content = _match[2];
       this.isVariable = true;
       this.content = content;
       this.filters = [Fragment.filterMap[filterFlag]];
@@ -51,7 +41,6 @@ export var Fragment = /*#__PURE__*/function () {
       this.path = [];
     }
   }
-
   _createClass(Fragment, [{
     key: "getValue",
     value: function getValue(data) {
@@ -63,27 +52,22 @@ export var Fragment = /*#__PURE__*/function () {
           return n(p);
         }, value != null ? value : '');
       }
-
       return this.content;
     }
   }]);
-
   return Fragment;
 }();
-
 _defineProperty(Fragment, "filterMap", {
   '=': escape,
   '-': function _(v) {
     return v;
   }
 });
-
 var fragmentListMap = {};
 export function toFragments(template, entryName) {
   if (fragmentListMap[entryName]) {
     return fragmentListMap[entryName];
   }
-
   var fragmentList = template.split(VARIABLE_SPLITTER).filter(function (v) {
     return Boolean(v);
   }).map(function (v) {

package/dist/js/treeshaking/ssr/serverRender/renderToString/type.js

@@ -1,5 +1,4 @@
 export var RenderLevel;
-
 (function (RenderLevel) {
   RenderLevel[RenderLevel["CLIENT_RENDER"] = 0] = "CLIENT_RENDER";
   RenderLevel[RenderLevel["SERVER_PREFETCH"] = 1] = "SERVER_PREFETCH";

package/dist/js/treeshaking/ssr/serverRender/utils.js

@@ -3,28 +3,23 @@ export function getLoadableScripts(extractor) {
   var check = function check(scripts) {
     return (scripts || '').includes('__LOADABLE_REQUIRED_CHUNKS___ext');
   };
-
   var scripts = extractor.getScriptTags();
-
   if (!check(scripts)) {
     return '';
   }
-
-  return scripts.split('</script>') // 前两个 script为 loadable 必须的 script
+  return scripts.split('</script>')
+  // 前两个 script为 loadable 必须的 script
   .slice(0, 2).map(function (i) {
     return "".concat(i, "</script>");
   }).join('');
 }
-
 var getLatency = function getLatency(hrtime) {
   var _process$hrtime = process.hrtime(hrtime),
-      _process$hrtime2 = _slicedToArray(_process$hrtime, 2),
-      s = _process$hrtime2[0],
-      ns = _process$hrtime2[1];
-
+    _process$hrtime2 = _slicedToArray(_process$hrtime, 2),
+    s = _process$hrtime2[0],
+    ns = _process$hrtime2[1];
   return s * 1e3 + ns / 1e6;
 };
-
 export var time = function time() {
   var hrtime = process.hrtime();
   return function () {

package/dist/js/treeshaking/ssr/utils.js

@@ -5,37 +5,31 @@ export var isReact18 = function isReact18() {
 };
 export var formatServer = function formatServer(request) {
   var _ref = request.headers || {},
-      _ref$cookie = _ref.cookie,
-      cookie = _ref$cookie === void 0 ? '' : _ref$cookie,
-      _ref$userAgent = _ref['user-agent'],
-      userAgent = _ref$userAgent === void 0 ? '' : _ref$userAgent,
-      referer = _ref.referer;
-
+    _ref$cookie = _ref.cookie,
+    cookie = _ref$cookie === void 0 ? '' : _ref$cookie,
+    _ref$userAgent = _ref['user-agent'],
+    userAgent = _ref$userAgent === void 0 ? '' : _ref$userAgent,
+    referer = _ref.referer;
   return _objectSpread({
     cookie: cookie,
     userAgent: userAgent,
     referer: referer
   }, request);
 };
-
 var getQuery = function getQuery() {
   return window.location.search.substring(1).split('&').reduce(function (res, item) {
     var _item$split = item.split('='),
-        _item$split2 = _slicedToArray(_item$split, 2),
-        key = _item$split2[0],
-        value = _item$split2[1];
-
+      _item$split2 = _slicedToArray(_item$split, 2),
+      key = _item$split2[0],
+      value = _item$split2[1];
     if (key) {
       res[key] = value;
     }
-
     return res;
   }, {});
 };
-
 export var formatClient = function formatClient(request) {
   var _request$headers, _request$headers2;
-
   return {
     params: request.params || {},
     host: request.host || location.host,
@@ -57,18 +51,15 @@ export var mockResponse = function mockResponse() {
     status: function status() {
       console.warn('response.status() can only be used in the server side');
     },
-
     get locals() {
       console.warn('response.locals can only be used in the server side');
       return {};
     }
-
   };
 };
 export var isCrossOrigin = function isCrossOrigin() {
   var url = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
   var base = arguments.length > 1 ? arguments[1] : undefined;
-
   if (url.startsWith('/') || url.startsWith('./')) {
     return false;
   } else if (!url.includes(base)) {

package/dist/js/treeshaking/state/cli/index.js

@@ -22,18 +22,14 @@ export default (function () {
         },
         modifyEntryImports: function modifyEntryImports(_ref) {
           var _getEntryOptions;
-
           var entrypoint = _ref.entrypoint,
-              imports = _ref.imports;
+            imports = _ref.imports;
           var entryName = entrypoint.entryName;
           var userConfig = api.useResolvedConfigContext();
-
           var _api$useAppContext = api.useAppContext(),
-              packageName = _api$useAppContext.packageName;
-
+            packageName = _api$useAppContext.packageName;
           var stateConfig = (_getEntryOptions = getEntryOptions(entryName, userConfig.runtime, userConfig.runtimeByEntries, packageName)) === null || _getEntryOptions === void 0 ? void 0 : _getEntryOptions.state;
           stateConfigMap.set(entryName, stateConfig);
-
           if (stateConfig) {
             imports.push({
               value: '@modern-js/runtime/plugins',
@@ -42,7 +38,6 @@ export default (function () {
               }]
             });
           }
-
           return {
             entrypoint: entrypoint,
             imports: imports
@@ -50,16 +45,14 @@ export default (function () {
         },
         modifyEntryRuntimePlugins: function modifyEntryRuntimePlugins(_ref2) {
           var entrypoint = _ref2.entrypoint,
-              plugins = _ref2.plugins;
+            plugins = _ref2.plugins;
           var stateOptions = stateConfigMap.get(entrypoint.entryName);
-
           if (stateOptions) {
             plugins.push({
               name: PLUGIN_IDENTIFIER,
               options: "".concat(JSON.stringify(stateConfigMap.get(entrypoint.entryName)))
             });
           }
-
           return {
             entrypoint: entrypoint,
             plugins: plugins

package/dist/js/treeshaking/state/runtime/plugin.js

@@ -13,7 +13,6 @@ var StatePluginHandleMap = {
   autoActions: autoActions,
   devtools: devtools
 };
-
 var getStoreConfig = function getStoreConfig(config) {
   var internalPlugins = ['immer', 'effects', 'autoActions', 'devtools'];
   var plugins = [];
@@ -26,7 +25,6 @@ var getStoreConfig = function getStoreConfig(config) {
     plugins: plugins
   };
 };
-
 var state = function state(config) {
   return {
     name: '@modern-js/plugin-state',
@@ -34,7 +32,6 @@ var state = function state(config) {
       return {
         hoc: function hoc(_ref, next) {
           var App = _ref.App;
-
           var getStateApp = function getStateApp(props) {
             // eslint-disable-next-line react-hooks/rules-of-hooks
             var context = useContext(RuntimeReactContext);
@@ -44,7 +41,6 @@ var state = function state(config) {
               children: /*#__PURE__*/_jsx(App, _objectSpread({}, props))
             });
           };
-
           return next({
             App: hoistNonReactStatics(getStateApp, App)
           });
@@ -52,21 +48,18 @@ var state = function state(config) {
         init: function init(_ref2, next) {
           var context = _ref2.context;
           var storeConfig = getStoreConfig(config || {});
-
           if (isBrowser()) {
             var _window, _window$_SSR_DATA, _window$_SSR_DATA$dat;
-
             storeConfig.initialState = storeConfig.initialState || ((_window = window) === null || _window === void 0 ? void 0 : (_window$_SSR_DATA = _window._SSR_DATA) === null || _window$_SSR_DATA === void 0 ? void 0 : (_window$_SSR_DATA$dat = _window$_SSR_DATA.data) === null || _window$_SSR_DATA$dat === void 0 ? void 0 : _window$_SSR_DATA$dat.storeState) || {};
           }
-
           context.store = createStore(storeConfig);
-          next({
+          return next({
             context: context
           });
         },
         pickContext: function pickContext(_ref3, next) {
           var context = _ref3.context,
-              pickedContext = _ref3.pickedContext;
+            pickedContext = _ref3.pickedContext;
           return next({
             context: context,
             pickedContext: _objectSpread(_objectSpread({}, pickedContext), {}, {
@@ -78,6 +71,5 @@ var state = function state(config) {
     }
   };
 };
-
 export default state;
 export * from "../plugins";