@modern-js/runtime 2.0.0-beta.3 → 2.0.0-canary.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/js/modern/router/runtime/index.js +1 -0
- package/dist/js/modern/router/runtime/plugin.js +21 -2
- package/dist/js/modern/ssr/serverRender/renderToStream/bulidTemplate.before.js +8 -5
- package/dist/js/node/router/runtime/index.js +9 -1
- package/dist/js/node/router/runtime/plugin.js +25 -2
- package/dist/js/node/ssr/serverRender/renderToStream/bulidTemplate.before.js +8 -5
- package/dist/js/treeshaking/router/runtime/index.js +1 -0
- package/dist/js/treeshaking/router/runtime/plugin.js +20 -2
- package/dist/js/treeshaking/ssr/serverRender/renderToStream/bulidTemplate.before.js +9 -6
- package/dist/types/router/runtime/index.d.ts +1 -0
- package/dist/types/router/runtime/plugin.d.ts +4 -1
- package/dist/types/router/runtime/types.d.ts +2 -1
- package/package.json +13 -5
|
@@ -6,6 +6,23 @@ import { createBrowserRouter, createHashRouter, RouterProvider, createRoutesFrom
|
|
|
6
6
|
import hoistNonReactStatics from 'hoist-non-react-statics';
|
|
7
7
|
import { renderRoutes, urlJoin } from "./utils";
|
|
8
8
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
9
|
+
// eslint-disable-next-line import/no-mutable-exports
|
|
10
|
+
export let finalRouteConfig = {
|
|
11
|
+
routes: []
|
|
12
|
+
};
|
|
13
|
+
// eslint-disable-next-line import/no-mutable-exports
|
|
14
|
+
export let beforeRenderRouter = true;
|
|
15
|
+
export function modifyRoutes(modifyFunction) {
|
|
16
|
+
if (beforeRenderRouter) {
|
|
17
|
+
const {
|
|
18
|
+
routes: originRoutes
|
|
19
|
+
} = finalRouteConfig;
|
|
20
|
+
const newRoutes = modifyFunction(originRoutes);
|
|
21
|
+
finalRouteConfig.routes = newRoutes;
|
|
22
|
+
} else {
|
|
23
|
+
console.error('it is not allowed to modify routes config after router render.');
|
|
24
|
+
}
|
|
25
|
+
}
|
|
9
26
|
export const routerPlugin = ({
|
|
10
27
|
serverBase: _serverBase = [],
|
|
11
28
|
supportHtml5History: _supportHtml5History = true,
|
|
@@ -14,6 +31,7 @@ export const routerPlugin = ({
|
|
|
14
31
|
createRoutes
|
|
15
32
|
}) => {
|
|
16
33
|
const select = pathname => _serverBase.find(baseUrl => pathname.search(baseUrl) === 0) || '/';
|
|
34
|
+
finalRouteConfig = routesConfig;
|
|
17
35
|
return {
|
|
18
36
|
name: '@modern-js/plugin-router',
|
|
19
37
|
setup: () => {
|
|
@@ -23,7 +41,7 @@ export const routerPlugin = ({
|
|
|
23
41
|
}, next) => {
|
|
24
42
|
// can not get routes config, skip wrapping React Router.
|
|
25
43
|
// e.g. App.tsx as the entrypoint
|
|
26
|
-
if (!
|
|
44
|
+
if (!finalRouteConfig && !createRoutes) {
|
|
27
45
|
return next({
|
|
28
46
|
App
|
|
29
47
|
});
|
|
@@ -31,7 +49,8 @@ export const routerPlugin = ({
|
|
|
31
49
|
const getRouteApp = () => {
|
|
32
50
|
return props => {
|
|
33
51
|
var _window$_SERVER_DATA;
|
|
34
|
-
|
|
52
|
+
beforeRenderRouter = true;
|
|
53
|
+
const routes = createRoutes ? createRoutes() : createRoutesFromElements(renderRoutes(finalRouteConfig));
|
|
35
54
|
const baseUrl = ((_window$_SERVER_DATA = window._SERVER_DATA) === null || _window$_SERVER_DATA === void 0 ? void 0 : _window$_SERVER_DATA.router.baseUrl) || select(location.pathname);
|
|
36
55
|
const _basename = baseUrl === '/' ? urlJoin(baseUrl, _basename2) : baseUrl;
|
|
37
56
|
const router = _supportHtml5History ? createBrowserRouter(routes, {
|
|
@@ -40,11 +40,14 @@ function getHeadTemplate(beforeEntryTemplate, context) {
|
|
|
40
40
|
}
|
|
41
41
|
const routeId = match.route.id;
|
|
42
42
|
if (routeId) {
|
|
43
|
-
const
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
43
|
+
const routeManifest = routeAssets[routeId];
|
|
44
|
+
if (routeManifest) {
|
|
45
|
+
const {
|
|
46
|
+
assets = []
|
|
47
|
+
} = routeManifest;
|
|
48
|
+
const _cssChunks = assets.filter(asset => asset === null || asset === void 0 ? void 0 : asset.endsWith('.css'));
|
|
49
|
+
cssChunks.push(..._cssChunks);
|
|
50
|
+
}
|
|
48
51
|
}
|
|
49
52
|
});
|
|
50
53
|
const styleLinks = cssChunks.map(chunk => {
|
|
@@ -3,8 +3,16 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
var _exportNames = {
|
|
6
|
+
var _exportNames = {
|
|
7
|
+
modifyRoutes: true
|
|
8
|
+
};
|
|
7
9
|
exports.default = void 0;
|
|
10
|
+
Object.defineProperty(exports, "modifyRoutes", {
|
|
11
|
+
enumerable: true,
|
|
12
|
+
get: function () {
|
|
13
|
+
return _plugin.modifyRoutes;
|
|
14
|
+
}
|
|
15
|
+
});
|
|
8
16
|
var _plugin = require("./plugin");
|
|
9
17
|
var _reactRouterDom = require("react-router-dom");
|
|
10
18
|
Object.keys(_reactRouterDom).forEach(function (key) {
|
|
@@ -3,6 +3,8 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
+
exports.finalRouteConfig = exports.beforeRenderRouter = void 0;
|
|
7
|
+
exports.modifyRoutes = modifyRoutes;
|
|
6
8
|
exports.routerPlugin = void 0;
|
|
7
9
|
var _react = _interopRequireDefault(require("react"));
|
|
8
10
|
var _reactRouterDom = require("react-router-dom");
|
|
@@ -13,6 +15,25 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
|
|
|
13
15
|
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; }
|
|
14
16
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
15
17
|
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; }
|
|
18
|
+
// eslint-disable-next-line import/no-mutable-exports
|
|
19
|
+
let finalRouteConfig = {
|
|
20
|
+
routes: []
|
|
21
|
+
};
|
|
22
|
+
// eslint-disable-next-line import/no-mutable-exports
|
|
23
|
+
exports.finalRouteConfig = finalRouteConfig;
|
|
24
|
+
let beforeRenderRouter = true;
|
|
25
|
+
exports.beforeRenderRouter = beforeRenderRouter;
|
|
26
|
+
function modifyRoutes(modifyFunction) {
|
|
27
|
+
if (beforeRenderRouter) {
|
|
28
|
+
const {
|
|
29
|
+
routes: originRoutes
|
|
30
|
+
} = finalRouteConfig;
|
|
31
|
+
const newRoutes = modifyFunction(originRoutes);
|
|
32
|
+
finalRouteConfig.routes = newRoutes;
|
|
33
|
+
} else {
|
|
34
|
+
console.error('it is not allowed to modify routes config after router render.');
|
|
35
|
+
}
|
|
36
|
+
}
|
|
16
37
|
const routerPlugin = ({
|
|
17
38
|
serverBase: _serverBase = [],
|
|
18
39
|
supportHtml5History: _supportHtml5History = true,
|
|
@@ -21,6 +42,7 @@ const routerPlugin = ({
|
|
|
21
42
|
createRoutes
|
|
22
43
|
}) => {
|
|
23
44
|
const select = pathname => _serverBase.find(baseUrl => pathname.search(baseUrl) === 0) || '/';
|
|
45
|
+
exports.finalRouteConfig = finalRouteConfig = routesConfig;
|
|
24
46
|
return {
|
|
25
47
|
name: '@modern-js/plugin-router',
|
|
26
48
|
setup: () => {
|
|
@@ -30,7 +52,7 @@ const routerPlugin = ({
|
|
|
30
52
|
}, next) => {
|
|
31
53
|
// can not get routes config, skip wrapping React Router.
|
|
32
54
|
// e.g. App.tsx as the entrypoint
|
|
33
|
-
if (!
|
|
55
|
+
if (!finalRouteConfig && !createRoutes) {
|
|
34
56
|
return next({
|
|
35
57
|
App
|
|
36
58
|
});
|
|
@@ -38,7 +60,8 @@ const routerPlugin = ({
|
|
|
38
60
|
const getRouteApp = () => {
|
|
39
61
|
return props => {
|
|
40
62
|
var _window$_SERVER_DATA;
|
|
41
|
-
|
|
63
|
+
exports.beforeRenderRouter = beforeRenderRouter = true;
|
|
64
|
+
const routes = createRoutes ? createRoutes() : (0, _reactRouterDom.createRoutesFromElements)((0, _utils.renderRoutes)(finalRouteConfig));
|
|
42
65
|
const baseUrl = ((_window$_SERVER_DATA = window._SERVER_DATA) === null || _window$_SERVER_DATA === void 0 ? void 0 : _window$_SERVER_DATA.router.baseUrl) || select(location.pathname);
|
|
43
66
|
const _basename = baseUrl === '/' ? (0, _utils.urlJoin)(baseUrl, _basename2) : baseUrl;
|
|
44
67
|
const router = _supportHtml5History ? (0, _reactRouterDom.createBrowserRouter)(routes, {
|
|
@@ -47,11 +47,14 @@ function getHeadTemplate(beforeEntryTemplate, context) {
|
|
|
47
47
|
}
|
|
48
48
|
const routeId = match.route.id;
|
|
49
49
|
if (routeId) {
|
|
50
|
-
const
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
50
|
+
const routeManifest = routeAssets[routeId];
|
|
51
|
+
if (routeManifest) {
|
|
52
|
+
const {
|
|
53
|
+
assets = []
|
|
54
|
+
} = routeManifest;
|
|
55
|
+
const _cssChunks = assets.filter(asset => asset === null || asset === void 0 ? void 0 : asset.endsWith('.css'));
|
|
56
|
+
cssChunks.push(..._cssChunks);
|
|
57
|
+
}
|
|
55
58
|
}
|
|
56
59
|
});
|
|
57
60
|
const styleLinks = cssChunks.map(chunk => {
|
|
@@ -4,6 +4,22 @@ import { createBrowserRouter, createHashRouter, RouterProvider, createRoutesFrom
|
|
|
4
4
|
import hoistNonReactStatics from 'hoist-non-react-statics';
|
|
5
5
|
import { renderRoutes, urlJoin } from "./utils";
|
|
6
6
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
7
|
+
// eslint-disable-next-line import/no-mutable-exports
|
|
8
|
+
export var finalRouteConfig = {
|
|
9
|
+
routes: []
|
|
10
|
+
};
|
|
11
|
+
// eslint-disable-next-line import/no-mutable-exports
|
|
12
|
+
export var beforeRenderRouter = true;
|
|
13
|
+
export function modifyRoutes(modifyFunction) {
|
|
14
|
+
if (beforeRenderRouter) {
|
|
15
|
+
var _finalRouteConfig = finalRouteConfig,
|
|
16
|
+
originRoutes = _finalRouteConfig.routes;
|
|
17
|
+
var newRoutes = modifyFunction(originRoutes);
|
|
18
|
+
finalRouteConfig.routes = newRoutes;
|
|
19
|
+
} else {
|
|
20
|
+
console.error('it is not allowed to modify routes config after router render.');
|
|
21
|
+
}
|
|
22
|
+
}
|
|
7
23
|
export var routerPlugin = function routerPlugin(_ref) {
|
|
8
24
|
var _ref$serverBase = _ref.serverBase,
|
|
9
25
|
serverBase = _ref$serverBase === void 0 ? [] : _ref$serverBase,
|
|
@@ -18,6 +34,7 @@ export var routerPlugin = function routerPlugin(_ref) {
|
|
|
18
34
|
return pathname.search(baseUrl) === 0;
|
|
19
35
|
}) || '/';
|
|
20
36
|
};
|
|
37
|
+
finalRouteConfig = routesConfig;
|
|
21
38
|
return {
|
|
22
39
|
name: '@modern-js/plugin-router',
|
|
23
40
|
setup: function setup() {
|
|
@@ -26,7 +43,7 @@ export var routerPlugin = function routerPlugin(_ref) {
|
|
|
26
43
|
var App = _ref2.App;
|
|
27
44
|
// can not get routes config, skip wrapping React Router.
|
|
28
45
|
// e.g. App.tsx as the entrypoint
|
|
29
|
-
if (!
|
|
46
|
+
if (!finalRouteConfig && !createRoutes) {
|
|
30
47
|
return next({
|
|
31
48
|
App: App
|
|
32
49
|
});
|
|
@@ -34,7 +51,8 @@ export var routerPlugin = function routerPlugin(_ref) {
|
|
|
34
51
|
var getRouteApp = function getRouteApp() {
|
|
35
52
|
return function (props) {
|
|
36
53
|
var _window$_SERVER_DATA;
|
|
37
|
-
|
|
54
|
+
beforeRenderRouter = true;
|
|
55
|
+
var routes = createRoutes ? createRoutes() : createRoutesFromElements(renderRoutes(finalRouteConfig));
|
|
38
56
|
var baseUrl = ((_window$_SERVER_DATA = window._SERVER_DATA) === null || _window$_SERVER_DATA === void 0 ? void 0 : _window$_SERVER_DATA.router.baseUrl) || select(location.pathname);
|
|
39
57
|
var _basename = baseUrl === '/' ? urlJoin(baseUrl, basename) : baseUrl;
|
|
40
58
|
var router = supportHtml5History ? createBrowserRouter(routes, {
|
|
@@ -41,12 +41,15 @@ function getHeadTemplate(beforeEntryTemplate, context) {
|
|
|
41
41
|
}
|
|
42
42
|
var routeId = match.route.id;
|
|
43
43
|
if (routeId) {
|
|
44
|
-
var
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
44
|
+
var _routeManifest = routeAssets[routeId];
|
|
45
|
+
if (_routeManifest) {
|
|
46
|
+
var _routeManifest$assets = _routeManifest.assets,
|
|
47
|
+
assets = _routeManifest$assets === void 0 ? [] : _routeManifest$assets;
|
|
48
|
+
var _cssChunks = assets.filter(function (asset) {
|
|
49
|
+
return asset === null || asset === void 0 ? void 0 : asset.endsWith('.css');
|
|
50
|
+
});
|
|
51
|
+
cssChunks.push.apply(cssChunks, _toConsumableArray(_cssChunks));
|
|
52
|
+
}
|
|
50
53
|
}
|
|
51
54
|
});
|
|
52
55
|
var styleLinks = cssChunks.map(function (chunk) {
|
|
@@ -2,5 +2,6 @@ import { routerPlugin } from './plugin';
|
|
|
2
2
|
import type { SingleRouteConfig, RouterConfig } from './types';
|
|
3
3
|
export type { SingleRouteConfig, RouterConfig };
|
|
4
4
|
export default routerPlugin;
|
|
5
|
+
export { modifyRoutes } from './plugin';
|
|
5
6
|
export * from 'react-router-dom';
|
|
6
7
|
export * from './withRouter';
|
|
@@ -1,5 +1,8 @@
|
|
|
1
1
|
import type { Plugin } from '../../core';
|
|
2
|
-
import type { RouterConfig } from './types';
|
|
2
|
+
import type { RouterConfig, Routes } from './types';
|
|
3
|
+
export declare let finalRouteConfig: RouterConfig['routesConfig'];
|
|
4
|
+
export declare let beforeRenderRouter: boolean;
|
|
5
|
+
export declare function modifyRoutes(modifyFunction: (routes: Routes) => Routes): void;
|
|
3
6
|
export declare const routerPlugin: ({
|
|
4
7
|
serverBase,
|
|
5
8
|
supportHtml5History,
|
package/package.json
CHANGED
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
"modern",
|
|
12
12
|
"modern.js"
|
|
13
13
|
],
|
|
14
|
-
"version": "2.0.0-
|
|
14
|
+
"version": "2.0.0-canary.0",
|
|
15
15
|
"engines": {
|
|
16
16
|
"node": ">=14.17.6"
|
|
17
17
|
},
|
|
@@ -53,6 +53,11 @@
|
|
|
53
53
|
"node": "./dist/js/node/document/index.js",
|
|
54
54
|
"default": "./dist/js/treeshaking/document/index.js"
|
|
55
55
|
},
|
|
56
|
+
"./document/cli": {
|
|
57
|
+
"jsnext:source": "./src/document/cli/index.ts",
|
|
58
|
+
"node": "./dist/js/node/document/cli/index.js",
|
|
59
|
+
"default": "./dist/js/treeshaking/document/cli/index.js"
|
|
60
|
+
},
|
|
56
61
|
"./ssr": {
|
|
57
62
|
"jsnext:source": "./src/ssr/index.ts",
|
|
58
63
|
"node": "./dist/js/node/ssr/index",
|
|
@@ -101,6 +106,9 @@
|
|
|
101
106
|
"document": [
|
|
102
107
|
"./dist/types/document/index.d.ts"
|
|
103
108
|
],
|
|
109
|
+
"document/cli": [
|
|
110
|
+
"./dist/types/document/cli/index.d.ts"
|
|
111
|
+
],
|
|
104
112
|
"ssr": [
|
|
105
113
|
"./dist/types/ssr/index.d.ts"
|
|
106
114
|
],
|
|
@@ -143,9 +151,9 @@
|
|
|
143
151
|
"redux-logger": "^3.0.6",
|
|
144
152
|
"serialize-javascript": "^6.0.0",
|
|
145
153
|
"styled-components": "^5.3.1",
|
|
146
|
-
"@modern-js/plugin": "2.0.0-beta.3",
|
|
147
154
|
"@modern-js/types": "2.0.0-beta.3",
|
|
148
|
-
"@modern-js/utils": "2.0.0-beta.3"
|
|
155
|
+
"@modern-js/utils": "2.0.0-beta.3",
|
|
156
|
+
"@modern-js/plugin": "2.0.0-beta.3"
|
|
149
157
|
},
|
|
150
158
|
"peerDependencies": {
|
|
151
159
|
"react": ">=17",
|
|
@@ -166,11 +174,11 @@
|
|
|
166
174
|
"react-dom": "^18",
|
|
167
175
|
"ts-jest": "^27.0.4",
|
|
168
176
|
"typescript": "^4",
|
|
169
|
-
"@modern-js/core": "2.0.0-beta.3",
|
|
170
|
-
"@modern-js/server-core": "2.0.0-beta.3",
|
|
171
177
|
"@modern-js/utils": "2.0.0-beta.3",
|
|
178
|
+
"@modern-js/server-core": "2.0.0-beta.3",
|
|
172
179
|
"@scripts/build": "2.0.0-beta.3",
|
|
173
180
|
"@modern-js/app-tools": "2.0.0-beta.3",
|
|
181
|
+
"@modern-js/core": "2.0.0-beta.3",
|
|
174
182
|
"@scripts/jest-config": "2.0.0-beta.3"
|
|
175
183
|
},
|
|
176
184
|
"sideEffects": false,
|