@modern-js/plugin-data-loader 2.0.0-beta.2 → 2.0.0-beta.3

package/dist/js/modern/cli/create-request.js

@@ -3,6 +3,7 @@
 // eslint-disable-next-line eslint-comments/disable-enable-pair
 /* eslint-disable node/no-unsupported-features/node-builtins */
 import { compile } from 'path-to-regexp';
+import { redirect } from 'react-router-dom';
 export const getRequestUrl = ({
   params,
   request,
@@ -17,6 +18,16 @@ export const getRequestUrl = ({
   url.searchParams.append('_loader', routeId);
   return url;
 };
+const handleRedirectResponse = res => {
+  const {
+    headers
+  } = res;
+  const location = headers.get('X-Modernjs-Redirect');
+  if (location) {
+    return redirect(location);
+  }
+  return res;
+};
 export const createRequest = (routeId, method = 'get') => {
   return async ({
     params,
@@ -32,7 +43,7 @@ export const createRequest = (routeId, method = 'get') => {
         method,
         signal: request.signal
       });
-      return res;
+      return handleRedirectResponse(res);
     } catch (error) {
       console.error(error);
       throw error;

package/dist/js/modern/cli/generate-client.js

@@ -1,24 +1,26 @@
 import path from 'path';
-import { getRouteId } from '@modern-js/utils';
 export const generateClient = ({
-  basedir,
-  filename,
-  entryName
+  mapFile
 }) => {
-  // TODO: loader 的约定变更
-  const componentPath = path.join(path.dirname(filename), 'layout.ts');
-  const routeId = getRouteId(componentPath, basedir, entryName);
+  const loadersMap = require(mapFile);
+  const requestCode = Object.keys(loadersMap).map(loaderId => {
+    const routeId = loadersMap[loaderId];
+    return `
+      const ${loaderId} = createRequest('${routeId}');
+    `;
+  }).join('');
+  let exportsCode = `export {`;
+  for (const loader of Object.keys(loadersMap)) {
+    exportsCode += `${loader},`;
+  }
+  exportsCode += '}';
   const requestCreatorPath = path.join(__dirname, './create-request').replace('node', 'treeshaking').replace(/\\/g, '/');
   const importCode = `
     import { createRequest } from '${requestCreatorPath}';
   `;
-  const requestCode = `
-    const loader = createRequest('${routeId}');
-    export default loader;
-    export { loader };
-  `;
   return `
     ${importCode}
     ${requestCode}
+    ${exportsCode}
   `;
 };

package/dist/js/modern/cli/loader.js

@@ -11,9 +11,7 @@ export default async function loader(source) {
   }
   const options = this.getOptions();
   const code = generateClient({
-    basedir: options.routesDir,
-    filename: this.resourcePath,
-    entryName: options.entryName
+    mapFile: options.mapFile
   });
   return code;
 }

package/dist/js/modern/server/index.js

@@ -3,6 +3,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 import { installGlobals, writeReadableStreamToWritable, Response as NodeResponse } from '@remix-run/node';
 import { matchRoutes } from 'react-router-dom';
+import { LOADER_ROUTES_DIR } from '@modern-js/utils';
 // Polyfill Web Fetch API
 installGlobals();
 const LOADER_SEARCH_PARAM = '_loader';
@@ -122,7 +123,7 @@ export const handleRequest = async ({
   }
   const {
     routes
-  } = await import(`${distDir}/loader-routes/${entry.entryName}`);
+  } = await import(`${distDir}/${LOADER_ROUTES_DIR}/${entry.entryName}`);
   if (!routes) {
     return;
   }
@@ -152,7 +153,15 @@ export const handleRequest = async ({
       request,
       loadContext: {}
     });
-    // TODO: 处理 redirect
+    if (isRedirectResponse(response)) {
+      const headers = new Headers(response.headers);
+      headers.set('X-Modernjs-Redirect', headers.get('Location'));
+      headers.delete('Location');
+      response = new NodeResponse(null, {
+        status: 204,
+        headers
+      });
+    }
   } catch (error) {
     const message = String(error);
     response = new NodeResponse(message, {

package/dist/js/node/cli/create-request.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.getRequestUrl = exports.createRequest = void 0;
 var _pathToRegexp = require("path-to-regexp");
+var _reactRouterDom = require("react-router-dom");
 // eslint-disable-next-line eslint-comments/disable-enable-pair
 /* eslint-disable node/prefer-global/url */
 // eslint-disable-next-line eslint-comments/disable-enable-pair
@@ -25,6 +26,16 @@ const getRequestUrl = ({
   return url;
 };
 exports.getRequestUrl = getRequestUrl;
+const handleRedirectResponse = res => {
+  const {
+    headers
+  } = res;
+  const location = headers.get('X-Modernjs-Redirect');
+  if (location) {
+    return (0, _reactRouterDom.redirect)(location);
+  }
+  return res;
+};
 const createRequest = (routeId, method = 'get') => {
   return async ({
     params,
@@ -40,7 +51,7 @@ const createRequest = (routeId, method = 'get') => {
         method,
         signal: request.signal
       });
-      return res;
+      return handleRedirectResponse(res);
     } catch (error) {
       console.error(error);
       throw error;

package/dist/js/node/cli/generate-client.js

@@ -5,28 +5,30 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.generateClient = void 0;
 var _path = _interopRequireDefault(require("path"));
-var _utils = require("@modern-js/utils");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 const generateClient = ({
-  basedir,
-  filename,
-  entryName
+  mapFile
 }) => {
-  // TODO: loader 的约定变更
-  const componentPath = _path.default.join(_path.default.dirname(filename), 'layout.ts');
-  const routeId = (0, _utils.getRouteId)(componentPath, basedir, entryName);
+  const loadersMap = require(mapFile);
+  const requestCode = Object.keys(loadersMap).map(loaderId => {
+    const routeId = loadersMap[loaderId];
+    return `
+      const ${loaderId} = createRequest('${routeId}');
+    `;
+  }).join('');
+  let exportsCode = `export {`;
+  for (const loader of Object.keys(loadersMap)) {
+    exportsCode += `${loader},`;
+  }
+  exportsCode += '}';
   const requestCreatorPath = _path.default.join(__dirname, './create-request').replace('node', 'treeshaking').replace(/\\/g, '/');
   const importCode = `
     import { createRequest } from '${requestCreatorPath}';
   `;
-  const requestCode = `
-    const loader = createRequest('${routeId}');
-    export default loader;
-    export { loader };
-  `;
   return `
     ${importCode}
     ${requestCode}
+    ${exportsCode}
   `;
 };
 exports.generateClient = generateClient;

package/dist/js/node/cli/loader.js

@@ -17,9 +17,7 @@ async function loader(source) {
   }
   const options = this.getOptions();
   const code = (0, _generateClient.generateClient)({
-    basedir: options.routesDir,
-    filename: this.resourcePath,
-    entryName: options.entryName
+    mapFile: options.mapFile
   });
   return code;
 }

package/dist/js/node/server/index.js

@@ -8,6 +8,7 @@ exports.isRedirectResponse = isRedirectResponse;
 exports.isResponse = isResponse;
 var _node = require("@remix-run/node");
 var _reactRouterDom = require("react-router-dom");
+var _utils = require("@modern-js/utils");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -133,7 +134,7 @@ const handleRequest = async ({
   }
   const {
     routes
-  } = await Promise.resolve(`${distDir}/loader-routes/${entry.entryName}`).then(s => _interopRequireWildcard(require(s)));
+  } = await Promise.resolve(`${distDir}/${_utils.LOADER_ROUTES_DIR}/${entry.entryName}`).then(s => _interopRequireWildcard(require(s)));
   if (!routes) {
     return;
   }
@@ -163,7 +164,15 @@ const handleRequest = async ({
       request,
       loadContext: {}
     });
-    // TODO: 处理 redirect
+    if (isRedirectResponse(response)) {
+      const headers = new Headers(response.headers);
+      headers.set('X-Modernjs-Redirect', headers.get('Location'));
+      headers.delete('Location');
+      response = new _node.Response(null, {
+        status: 204,
+        headers
+      });
+    }
   } catch (error) {
     const message = String(error);
     response = new _node.Response(message, {

package/dist/js/treeshaking/cli/create-request.js

@@ -5,6 +5,7 @@ import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
 // eslint-disable-next-line eslint-comments/disable-enable-pair
 /* eslint-disable node/no-unsupported-features/node-builtins */
 import { compile } from 'path-to-regexp';
+import { redirect } from 'react-router-dom';
 export var getRequestUrl = function getRequestUrl(_ref) {
   var params = _ref.params,
     request = _ref.request,
@@ -18,6 +19,14 @@ export var getRequestUrl = function getRequestUrl(_ref) {
   url.searchParams.append('_loader', routeId);
   return url;
 };
+var handleRedirectResponse = function handleRedirectResponse(res) {
+  var headers = res.headers;
+  var location = headers.get('X-Modernjs-Redirect');
+  if (location) {
+    return redirect(location);
+  }
+  return res;
+};
 export var createRequest = function createRequest(routeId) {
   var method = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'get';
   return /*#__PURE__*/function () {
@@ -41,7 +50,7 @@ export var createRequest = function createRequest(routeId) {
               });
             case 5:
               res = _context.sent;
-              return _context.abrupt("return", res);
+              return _context.abrupt("return", handleRedirectResponse(res));
             case 9:
               _context.prev = 9;
               _context.t0 = _context["catch"](2);

package/dist/js/treeshaking/cli/generate-client.js

@@ -1,14 +1,18 @@
 import path from 'path';
-import { getRouteId } from '@modern-js/utils';
 export var generateClient = function generateClient(_ref) {
-  var basedir = _ref.basedir,
-    filename = _ref.filename,
-    entryName = _ref.entryName;
-  // TODO: loader 的约定变更
-  var componentPath = path.join(path.dirname(filename), 'layout.ts');
-  var routeId = getRouteId(componentPath, basedir, entryName);
+  var mapFile = _ref.mapFile;
+  var loadersMap = require(mapFile);
+  var requestCode = Object.keys(loadersMap).map(function (loaderId) {
+    var routeId = loadersMap[loaderId];
+    return "\n      const ".concat(loaderId, " = createRequest('").concat(routeId, "');\n    ");
+  }).join('');
+  var exportsCode = "export {";
+  for (var _i = 0, _Object$keys = Object.keys(loadersMap); _i < _Object$keys.length; _i++) {
+    var loader = _Object$keys[_i];
+    exportsCode += "".concat(loader, ",");
+  }
+  exportsCode += '}';
   var requestCreatorPath = path.join(__dirname, './create-request').replace('node', 'treeshaking').replace(/\\/g, '/');
   var importCode = "\n    import { createRequest } from '".concat(requestCreatorPath, "';\n  ");
-  var requestCode = "\n    const loader = createRequest('".concat(routeId, "');\n    export default loader;\n    export { loader };\n  ");
-  return "\n    ".concat(importCode, "\n    ").concat(requestCode, "\n  ");
+  return "\n    ".concat(importCode, "\n    ").concat(requestCode, "\n    ").concat(exportsCode, "\n  ");
 };

package/dist/js/treeshaking/cli/loader.js

@@ -25,9 +25,7 @@ function _loader() {
           case 4:
             options = this.getOptions();
             code = generateClient({
-              basedir: options.routesDir,
-              filename: this.resourcePath,
-              entryName: options.entryName
+              mapFile: options.mapFile
             });
             return _context.abrupt("return", code);
           case 7:

package/dist/js/treeshaking/server/index.js

@@ -6,6 +6,7 @@ import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
 import _typeof from "@babel/runtime/helpers/esm/typeof";
 import { installGlobals, writeReadableStreamToWritable, Response as NodeResponse } from '@remix-run/node';
 import { matchRoutes } from 'react-router-dom';
+import { LOADER_ROUTES_DIR } from '@modern-js/utils';
 // Polyfill Web Fetch API
 installGlobals();
 var LOADER_SEARCH_PARAM = '_loader';
@@ -178,7 +179,7 @@ var matchEntry = function matchEntry(pathname, entries) {
 };
 export var handleRequest = /*#__PURE__*/function () {
   var _ref5 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3(_ref4) {
-    var context, serverRoutes, distDir, method, query, routeId, entry, _yield$import, routes, res, pathname, matches, match, request, response, message;
+    var context, serverRoutes, distDir, method, query, routeId, entry, _yield$import, routes, res, pathname, matches, match, request, response, headers, message;
     return _regeneratorRuntime().wrap(function _callee3$(_context3) {
       while (1) {
         switch (_context3.prev = _context3.next) {
@@ -200,7 +201,7 @@ export var handleRequest = /*#__PURE__*/function () {
             return _context3.abrupt("return");
           case 8:
             _context3.next = 10;
-            return import("".concat(distDir, "/loader-routes/").concat(entry.entryName));
+            return import("".concat(distDir, "/").concat(LOADER_ROUTES_DIR, "/").concat(entry.entryName));
           case 10:
             _yield$import = _context3.sent;
             routes = _yield$import.routes;
@@ -244,10 +245,19 @@ export var handleRequest = /*#__PURE__*/function () {
             });
           case 30:
             response = _context3.sent;
-            _context3.next = 37;
+            if (isRedirectResponse(response)) {
+              headers = new Headers(response.headers);
+              headers.set('X-Modernjs-Redirect', headers.get('Location'));
+              headers["delete"]('Location');
+              response = new NodeResponse(null, {
+                status: 204,
+                headers: headers
+              });
+            }
+            _context3.next = 38;
             break;
-          case 33:
-            _context3.prev = 33;
+          case 34:
+            _context3.prev = 34;
             _context3.t0 = _context3["catch"](27);
             message = String(_context3.t0);
             response = new NodeResponse(message, {
@@ -256,14 +266,14 @@ export var handleRequest = /*#__PURE__*/function () {
                 'Content-Type': 'text/plain'
               }
             });
-          case 37:
-            sendLoaderResponse(res, response);
           case 38:
+            sendLoaderResponse(res, response);
+          case 39:
           case "end":
             return _context3.stop();
         }
       }
-    }, _callee3, null, [[27, 33]]);
+    }, _callee3, null, [[27, 34]]);
   }));
   return function handleRequest(_x4) {
     return _ref5.apply(this, arguments);

package/dist/types/cli/generate-client.d.ts

@@ -1,9 +1,5 @@
 export declare const generateClient: ({
-  basedir,
-  filename,
-  entryName
+  mapFile
 }: {
-  basedir: string;
-  filename: string;
-  entryName: string;
+  mapFile: string;
 }) => string;

package/dist/types/cli/loader.d.ts

@@ -2,4 +2,5 @@ import type { LoaderContext } from 'webpack';
 export default function loader(this: LoaderContext<{
   routesDir: string;
   entryName: string;
+  mapFile: string;
 }>, source: string): Promise<string>;

package/package.json

@@ -11,7 +11,7 @@
     "modern",
     "modern.js"
   ],
-  "version": "2.0.0-beta.2",
+  "version": "2.0.0-beta.3",
   "jsnext:source": "./src/index.ts",
   "types": "./dist/types/index.d.ts",
   "main": "./dist/js/node/index.js",
@@ -42,9 +42,9 @@
     "@babel/runtime": "^7.18.0",
     "@remix-run/node": "^1.7.0",
     "path-to-regexp": "^6.2.0",
-    "react-router-dom": "^6.4.2",
-    "@modern-js/babel-compiler": "2.0.0-beta.2",
-    "@modern-js/utils": "2.0.0-beta.2"
+    "react-router-dom": "^6.4.4",
+    "@modern-js/babel-compiler": "2.0.0-beta.3",
+    "@modern-js/utils": "2.0.0-beta.3"
   },
   "devDependencies": {
     "@types/babel__core": "^7.1.15",
@@ -57,13 +57,13 @@
     "supertest": "^6.1.6",
     "ts-jest": "^27.0.5",
     "typescript": "^4",
-    "webpack": "^5.74.0",
+    "webpack": "^5.75.0",
     "webpack-chain": "^6.5.1",
-    "@modern-js/core": "2.0.0-beta.2",
-    "@modern-js/server-core": "2.0.0-beta.2",
-    "@modern-js/types": "2.0.0-beta.2",
-    "@scripts/build": "2.0.0-beta.2",
-    "@scripts/jest-config": "2.0.0-beta.2"
+    "@modern-js/core": "2.0.0-beta.3",
+    "@modern-js/server-core": "2.0.0-beta.3",
+    "@modern-js/types": "2.0.0-beta.3",
+    "@scripts/build": "2.0.0-beta.3",
+    "@scripts/jest-config": "2.0.0-beta.3"
   },
   "sideEffects": false,
   "publishConfig": {