@modern-js/runtime 2.30.0 → 2.31.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/CHANGELOG.md +15 -0
- package/dist/cjs/document/Body.js +1 -0
- package/dist/cjs/document/Head.js +2 -0
- package/dist/cjs/document/cli/index.js +8 -1
- package/dist/cjs/document/constants.js +12 -0
- package/dist/cjs/router/runtime/plugin.js +49 -37
- package/dist/esm/document/Body.js +2 -1
- package/dist/esm/document/Head.js +3 -1
- package/dist/esm/document/cli/index.js +9 -2
- package/dist/esm/document/constants.js +3 -0
- package/dist/esm/router/runtime/plugin.js +52 -40
- package/dist/esm-node/document/Body.js +2 -1
- package/dist/esm-node/document/Head.js +3 -1
- package/dist/esm-node/document/cli/index.js +9 -2
- package/dist/esm-node/document/constants.js +3 -0
- package/dist/esm-node/router/runtime/plugin.js +50 -38
- package/dist/types/document/constants.d.ts +3 -0
- package/package.json +9 -9
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,20 @@
|
|
|
1
1
|
# @modern-js/runtime
|
|
2
2
|
|
|
3
|
+
## 2.31.0
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- 4a87c07: feat: memo creating router
|
|
8
|
+
feat: 缓存 router 创建
|
|
9
|
+
- 2361ce8: feat: support partials html in Document
|
|
10
|
+
feat: 支持 partials html 在 Document 中也生效
|
|
11
|
+
- cd39c6f: fix: use [\s\S]_ to replace ._ for \n\r char regex
|
|
12
|
+
fix: 使用 [\s\X]_ 替换 ._ 匹配 \n\r 字符
|
|
13
|
+
- Updated dependencies [1882366]
|
|
14
|
+
- @modern-js/utils@2.31.0
|
|
15
|
+
- @modern-js/plugin@2.31.0
|
|
16
|
+
- @modern-js/types@2.31.0
|
|
17
|
+
|
|
3
18
|
## 2.30.0
|
|
4
19
|
|
|
5
20
|
### Minor Changes
|
|
@@ -22,6 +22,7 @@ function Body(props) {
|
|
|
22
22
|
children: [
|
|
23
23
|
hasSetRoot ? null : /* @__PURE__ */ (0, _jsxruntime.jsx)(_Root.DefaultRoot, {}),
|
|
24
24
|
children,
|
|
25
|
+
`${_constants.BODY_PARTICALS_SEPARATOR}`,
|
|
25
26
|
`${_constants.DOCUMENT_CHUNKSMAP_PLACEHOLDER}`,
|
|
26
27
|
`${_constants.DOCUMENT_SSRDATASCRIPT_PLACEHOLDER}`
|
|
27
28
|
]
|
|
@@ -30,9 +30,11 @@ function Head(props) {
|
|
|
30
30
|
return /* @__PURE__ */ (0, _jsxruntime.jsxs)("head", {
|
|
31
31
|
...rest,
|
|
32
32
|
children: [
|
|
33
|
+
`${_constants.TOP_PARTICALS_SEPARATOR}`,
|
|
33
34
|
`${_constants.DOCUMENT_META_PLACEHOLDER}`,
|
|
34
35
|
!hasSetLinks && /* @__PURE__ */ (0, _jsxruntime.jsx)(_Links.Links, {}),
|
|
35
36
|
!hasSetScripts && /* @__PURE__ */ (0, _jsxruntime.jsx)(_Scripts.Scripts, {}),
|
|
37
|
+
`${_constants.HEAD_PARTICALS_SEPARATOR}`,
|
|
36
38
|
children
|
|
37
39
|
]
|
|
38
40
|
});
|
|
@@ -68,7 +68,7 @@ const documentPlugin = () => ({
|
|
|
68
68
|
return null;
|
|
69
69
|
}
|
|
70
70
|
return async ({ htmlWebpackPlugin }) => {
|
|
71
|
-
var _tsConfig;
|
|
71
|
+
var _tsConfig, _partialsByEntrypoint;
|
|
72
72
|
const config = api.useResolvedConfigContext();
|
|
73
73
|
const documentParams = getDocParams({
|
|
74
74
|
config,
|
|
@@ -133,10 +133,17 @@ const documentPlugin = () => ({
|
|
|
133
133
|
}, _react.default.createElement(Document, null));
|
|
134
134
|
let html = _server.default.renderToStaticMarkup(HTMLElement);
|
|
135
135
|
debug("entry %s's document jsx rendered html: %o", entryName, html);
|
|
136
|
+
const { partialsByEntrypoint } = api.useAppContext();
|
|
136
137
|
const scripts = [
|
|
137
138
|
htmlWebpackPlugin.tags.headTags.filter((item) => item.tagName === "script").join(""),
|
|
138
139
|
htmlWebpackPlugin.tags.bodyTags.toString()
|
|
139
140
|
].join("");
|
|
141
|
+
if ((_partialsByEntrypoint = partialsByEntrypoint) === null || _partialsByEntrypoint === void 0 ? void 0 : _partialsByEntrypoint[entryName]) {
|
|
142
|
+
const partialsTop = partialsByEntrypoint[entryName].top.join("\n");
|
|
143
|
+
const partialsHead = partialsByEntrypoint[entryName].head.join("\n");
|
|
144
|
+
const partialsBody = partialsByEntrypoint[entryName].body.join("\n");
|
|
145
|
+
html = html.replace(_constants.TOP_PARTICALS_SEPARATOR, partialsTop).replace(_constants.HEAD_PARTICALS_SEPARATOR, partialsHead).replace(_constants.BODY_PARTICALS_SEPARATOR, partialsBody);
|
|
146
|
+
}
|
|
140
147
|
const links = [
|
|
141
148
|
htmlWebpackPlugin.tags.headTags.filter((item) => item.tagName === "link").join("")
|
|
142
149
|
].join("");
|
|
@@ -19,6 +19,15 @@ _export(exports, {
|
|
|
19
19
|
HTML_SEPARATOR: function() {
|
|
20
20
|
return HTML_SEPARATOR;
|
|
21
21
|
},
|
|
22
|
+
HEAD_PARTICALS_SEPARATOR: function() {
|
|
23
|
+
return HEAD_PARTICALS_SEPARATOR;
|
|
24
|
+
},
|
|
25
|
+
BODY_PARTICALS_SEPARATOR: function() {
|
|
26
|
+
return BODY_PARTICALS_SEPARATOR;
|
|
27
|
+
},
|
|
28
|
+
TOP_PARTICALS_SEPARATOR: function() {
|
|
29
|
+
return TOP_PARTICALS_SEPARATOR;
|
|
30
|
+
},
|
|
22
31
|
HTML_SSRDATASCRIPT_SEPARATOR: function() {
|
|
23
32
|
return HTML_SSRDATASCRIPT_SEPARATOR;
|
|
24
33
|
},
|
|
@@ -71,6 +80,9 @@ const DOC_EXT = [
|
|
|
71
80
|
];
|
|
72
81
|
const DOCUMENT_META_PLACEHOLDER = encodeURIComponent("<%= meta %>");
|
|
73
82
|
const HTML_SEPARATOR = "<!--<?- html ?>-->";
|
|
83
|
+
const HEAD_PARTICALS_SEPARATOR = encodeURIComponent("<!--<?- partials.head ?>-->");
|
|
84
|
+
const BODY_PARTICALS_SEPARATOR = encodeURIComponent("<!--<?- partials.body ?>-->");
|
|
85
|
+
const TOP_PARTICALS_SEPARATOR = encodeURIComponent("<!--<?- partials.top ?>-->");
|
|
74
86
|
const HTML_SSRDATASCRIPT_SEPARATOR = "<!--<?- SSRDataScript ?>-->";
|
|
75
87
|
const DOCUMENT_SSR_PLACEHOLDER = encodeURIComponent(HTML_SEPARATOR);
|
|
76
88
|
const DOCUMENT_CHUNKSMAP_PLACEHOLDER = encodeURIComponent(_constants.HTML_CHUNKSMAP_SEPARATOR);
|
|
@@ -80,51 +80,63 @@ const routerPlugin = ({ serverBase = [], supportHtml5History = true, basename =
|
|
|
80
80
|
});
|
|
81
81
|
}
|
|
82
82
|
const getRouteApp = () => {
|
|
83
|
-
|
|
84
|
-
var _window__SERVER_DATA
|
|
85
|
-
beforeCreateRouter = false;
|
|
86
|
-
routes = createRoutes ? createRoutes() : (0, _router.createRoutesFromElements)((0, _utils.renderRoutes)({
|
|
87
|
-
routesConfig: finalRouteConfig,
|
|
88
|
-
props
|
|
89
|
-
}));
|
|
90
|
-
const runner = api.useHookRunners();
|
|
91
|
-
routes = runner.modifyRoutes(routes);
|
|
83
|
+
const useCreateRouter = (props) => {
|
|
84
|
+
var _window__SERVER_DATA;
|
|
92
85
|
const baseUrl = ((_window__SERVER_DATA = window._SERVER_DATA) === null || _window__SERVER_DATA === void 0 ? void 0 : _window__SERVER_DATA.router.baseUrl) || select(location.pathname);
|
|
93
86
|
const _basename = baseUrl === "/" ? (0, _utils.urlJoin)(baseUrl, basename) : baseUrl;
|
|
94
87
|
let hydrationData = window._ROUTER_DATA;
|
|
95
|
-
if ((_hydrationData = hydrationData) === null || _hydrationData === void 0 ? void 0 : _hydrationData.errors) {
|
|
96
|
-
hydrationData = {
|
|
97
|
-
...hydrationData,
|
|
98
|
-
errors: (0, _utils.deserializeErrors)(hydrationData.errors)
|
|
99
|
-
};
|
|
100
|
-
}
|
|
101
|
-
const router = supportHtml5History ? (0, _router.createBrowserRouter)(routes, {
|
|
102
|
-
basename: _basename,
|
|
103
|
-
hydrationData
|
|
104
|
-
}) : (0, _router.createHashRouter)(routes, {
|
|
105
|
-
basename: _basename,
|
|
106
|
-
hydrationData
|
|
107
|
-
});
|
|
108
88
|
const runtimeContext = (0, _react.useContext)(_core.RuntimeReactContext);
|
|
109
|
-
|
|
89
|
+
const { unstable_getBlockNavState: getBlockNavState } = runtimeContext;
|
|
90
|
+
return (0, _react.useMemo)(() => {
|
|
91
|
+
var _hydrationData;
|
|
92
|
+
if ((_hydrationData = hydrationData) === null || _hydrationData === void 0 ? void 0 : _hydrationData.errors) {
|
|
93
|
+
hydrationData = {
|
|
94
|
+
...hydrationData,
|
|
95
|
+
errors: (0, _utils.deserializeErrors)(hydrationData.errors)
|
|
96
|
+
};
|
|
97
|
+
}
|
|
98
|
+
routes = createRoutes ? createRoutes() : (0, _router.createRoutesFromElements)((0, _utils.renderRoutes)({
|
|
99
|
+
routesConfig: finalRouteConfig,
|
|
100
|
+
props
|
|
101
|
+
}));
|
|
102
|
+
const runner = api.useHookRunners();
|
|
103
|
+
routes = runner.modifyRoutes(routes);
|
|
104
|
+
const router = supportHtml5History ? (0, _router.createBrowserRouter)(routes, {
|
|
105
|
+
basename: _basename,
|
|
106
|
+
hydrationData
|
|
107
|
+
}) : (0, _router.createHashRouter)(routes, {
|
|
108
|
+
basename: _basename,
|
|
109
|
+
hydrationData
|
|
110
|
+
});
|
|
111
|
+
const originSubscribe = router.subscribe;
|
|
112
|
+
router.subscribe = (listener) => {
|
|
113
|
+
const wrapedListener = (...args) => {
|
|
114
|
+
const blockRoute = getBlockNavState ? getBlockNavState() : false;
|
|
115
|
+
if (blockRoute) {
|
|
116
|
+
return;
|
|
117
|
+
}
|
|
118
|
+
return listener(...args);
|
|
119
|
+
};
|
|
120
|
+
return originSubscribe(wrapedListener);
|
|
121
|
+
};
|
|
110
122
|
Object.defineProperty(runtimeContext, "remixRouter", {
|
|
111
123
|
get() {
|
|
112
124
|
return router;
|
|
113
|
-
}
|
|
125
|
+
},
|
|
126
|
+
configurable: true
|
|
114
127
|
});
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
};
|
|
128
|
+
return router;
|
|
129
|
+
}, [
|
|
130
|
+
finalRouteConfig,
|
|
131
|
+
props,
|
|
132
|
+
_basename,
|
|
133
|
+
hydrationData,
|
|
134
|
+
getBlockNavState
|
|
135
|
+
]);
|
|
136
|
+
};
|
|
137
|
+
return (props) => {
|
|
138
|
+
beforeCreateRouter = false;
|
|
139
|
+
const router = useCreateRouter(props);
|
|
128
140
|
return /* @__PURE__ */ (0, _jsxruntime.jsx)(App, {
|
|
129
141
|
...props,
|
|
130
142
|
children: /* @__PURE__ */ (0, _jsxruntime.jsx)(_router.RouterProvider, {
|
|
@@ -3,7 +3,7 @@ import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
|
|
|
3
3
|
import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
|
|
4
4
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
5
5
|
import { useContext } from "react";
|
|
6
|
-
import { DOCUMENT_CHUNKSMAP_PLACEHOLDER, DOCUMENT_SSRDATASCRIPT_PLACEHOLDER } from "./constants";
|
|
6
|
+
import { BODY_PARTICALS_SEPARATOR, DOCUMENT_CHUNKSMAP_PLACEHOLDER, DOCUMENT_SSRDATASCRIPT_PLACEHOLDER } from "./constants";
|
|
7
7
|
import { DocumentStructureContext } from "./DocumentStructureContext";
|
|
8
8
|
import { DefaultRoot } from "./Root";
|
|
9
9
|
export function Body(props) {
|
|
@@ -15,6 +15,7 @@ export function Body(props) {
|
|
|
15
15
|
children: [
|
|
16
16
|
hasSetRoot ? null : /* @__PURE__ */ _jsx(DefaultRoot, {}),
|
|
17
17
|
children,
|
|
18
|
+
"".concat(BODY_PARTICALS_SEPARATOR),
|
|
18
19
|
"".concat(DOCUMENT_CHUNKSMAP_PLACEHOLDER),
|
|
19
20
|
"".concat(DOCUMENT_SSRDATASCRIPT_PLACEHOLDER)
|
|
20
21
|
]
|
|
@@ -6,7 +6,7 @@ import { useContext } from "react";
|
|
|
6
6
|
import { DocumentStructureContext } from "./DocumentStructureContext";
|
|
7
7
|
import { Scripts } from "./Scripts";
|
|
8
8
|
import { Links } from "./Links";
|
|
9
|
-
import { DOCUMENT_META_PLACEHOLDER } from "./constants";
|
|
9
|
+
import { DOCUMENT_META_PLACEHOLDER, HEAD_PARTICALS_SEPARATOR, TOP_PARTICALS_SEPARATOR } from "./constants";
|
|
10
10
|
export function Head(props) {
|
|
11
11
|
var _useContext = useContext(DocumentStructureContext), hasSetScripts = _useContext.hasSetScripts, hasSetLinks = _useContext.hasSetLinks;
|
|
12
12
|
var children = props.children, rest = _object_without_properties(props, [
|
|
@@ -14,9 +14,11 @@ export function Head(props) {
|
|
|
14
14
|
]);
|
|
15
15
|
return /* @__PURE__ */ _jsxs("head", _object_spread_props(_object_spread({}, rest), {
|
|
16
16
|
children: [
|
|
17
|
+
"".concat(TOP_PARTICALS_SEPARATOR),
|
|
17
18
|
"".concat(DOCUMENT_META_PLACEHOLDER),
|
|
18
19
|
!hasSetLinks && /* @__PURE__ */ _jsx(Links, {}),
|
|
19
20
|
!hasSetScripts && /* @__PURE__ */ _jsx(Scripts, {}),
|
|
21
|
+
"".concat(HEAD_PARTICALS_SEPARATOR),
|
|
20
22
|
children
|
|
21
23
|
]
|
|
22
24
|
}));
|
|
@@ -8,7 +8,7 @@ import ReactDomServer from "react-dom/server";
|
|
|
8
8
|
import { build } from "esbuild";
|
|
9
9
|
import { createDebugger, findExists, fs } from "@modern-js/utils";
|
|
10
10
|
import { DocumentContext } from "../DocumentContext";
|
|
11
|
-
import { DOCUMENT_SCRIPTS_PLACEHOLDER, DOCUMENT_LINKS_PLACEHOLDER, DOCUMENT_FILE_NAME, DOCUMENT_META_PLACEHOLDER, PLACEHOLDER_REPLACER_MAP, DOC_EXT, DOCUMENT_SSR_PLACEHOLDER, DOCUMENT_CHUNKSMAP_PLACEHOLDER, DOCUMENT_SSRDATASCRIPT_PLACEHOLDER, DOCUMENT_SCRIPT_PLACEHOLDER_START, DOCUMENT_SCRIPT_PLACEHOLDER_END, HTML_SEPARATOR, DOCUMENT_COMMENT_PLACEHOLDER_START, DOCUMENT_COMMENT_PLACEHOLDER_END, DOCUMENT_STYLE_PLACEHOLDER_START, DOCUMENT_STYLE_PLACEHOLDER_END } from "../constants";
|
|
11
|
+
import { DOCUMENT_SCRIPTS_PLACEHOLDER, DOCUMENT_LINKS_PLACEHOLDER, DOCUMENT_FILE_NAME, DOCUMENT_META_PLACEHOLDER, PLACEHOLDER_REPLACER_MAP, DOC_EXT, DOCUMENT_SSR_PLACEHOLDER, DOCUMENT_CHUNKSMAP_PLACEHOLDER, DOCUMENT_SSRDATASCRIPT_PLACEHOLDER, DOCUMENT_SCRIPT_PLACEHOLDER_START, DOCUMENT_SCRIPT_PLACEHOLDER_END, HTML_SEPARATOR, DOCUMENT_COMMENT_PLACEHOLDER_START, DOCUMENT_COMMENT_PLACEHOLDER_END, DOCUMENT_STYLE_PLACEHOLDER_START, DOCUMENT_STYLE_PLACEHOLDER_END, TOP_PARTICALS_SEPARATOR, HEAD_PARTICALS_SEPARATOR, BODY_PARTICALS_SEPARATOR } from "../constants";
|
|
12
12
|
var debug = createDebugger("html_genarate");
|
|
13
13
|
export var getDocumenByEntryName = function getDocumenByEntryName2(entrypoints, entryName, fallbackDir) {
|
|
14
14
|
var _entrypoints_find;
|
|
@@ -57,7 +57,7 @@ export var documentPlugin = function() {
|
|
|
57
57
|
}
|
|
58
58
|
return function() {
|
|
59
59
|
var _ref2 = _async_to_generator(function(param) {
|
|
60
|
-
var htmlWebpackPlugin, _tsConfig, config, documentParams, tempTsConfigFile, userTsConfigFilePath, tsConfig, err, htmlOutputFile, Document, HTMLElement, html, scripts, links, metas, nonce, nonceAttr, finalHtml;
|
|
60
|
+
var htmlWebpackPlugin, _tsConfig, _partialsByEntrypoint, config, documentParams, tempTsConfigFile, userTsConfigFilePath, tsConfig, err, htmlOutputFile, Document, HTMLElement, html, partialsByEntrypoint, scripts, partialsTop, partialsHead, partialsBody, links, metas, nonce, nonceAttr, finalHtml;
|
|
61
61
|
return _ts_generator(this, function(_state2) {
|
|
62
62
|
switch (_state2.label) {
|
|
63
63
|
case 0:
|
|
@@ -156,12 +156,19 @@ export var documentPlugin = function() {
|
|
|
156
156
|
}, React.createElement(Document, null));
|
|
157
157
|
html = ReactDomServer.renderToStaticMarkup(HTMLElement);
|
|
158
158
|
debug("entry %s's document jsx rendered html: %o", entryName, html);
|
|
159
|
+
partialsByEntrypoint = api.useAppContext().partialsByEntrypoint;
|
|
159
160
|
scripts = [
|
|
160
161
|
htmlWebpackPlugin.tags.headTags.filter(function(item) {
|
|
161
162
|
return item.tagName === "script";
|
|
162
163
|
}).join(""),
|
|
163
164
|
htmlWebpackPlugin.tags.bodyTags.toString()
|
|
164
165
|
].join("");
|
|
166
|
+
if ((_partialsByEntrypoint = partialsByEntrypoint) === null || _partialsByEntrypoint === void 0 ? void 0 : _partialsByEntrypoint[entryName]) {
|
|
167
|
+
partialsTop = partialsByEntrypoint[entryName].top.join("\n");
|
|
168
|
+
partialsHead = partialsByEntrypoint[entryName].head.join("\n");
|
|
169
|
+
partialsBody = partialsByEntrypoint[entryName].body.join("\n");
|
|
170
|
+
html = html.replace(TOP_PARTICALS_SEPARATOR, partialsTop).replace(HEAD_PARTICALS_SEPARATOR, partialsHead).replace(BODY_PARTICALS_SEPARATOR, partialsBody);
|
|
171
|
+
}
|
|
165
172
|
links = [
|
|
166
173
|
htmlWebpackPlugin.tags.headTags.filter(function(item) {
|
|
167
174
|
return item.tagName === "link";
|
|
@@ -8,6 +8,9 @@ export var DOC_EXT = [
|
|
|
8
8
|
];
|
|
9
9
|
export var DOCUMENT_META_PLACEHOLDER = encodeURIComponent("<%= meta %>");
|
|
10
10
|
export var HTML_SEPARATOR = "<!--<?- html ?>-->";
|
|
11
|
+
export var HEAD_PARTICALS_SEPARATOR = encodeURIComponent("<!--<?- partials.head ?>-->");
|
|
12
|
+
export var BODY_PARTICALS_SEPARATOR = encodeURIComponent("<!--<?- partials.body ?>-->");
|
|
13
|
+
export var TOP_PARTICALS_SEPARATOR = encodeURIComponent("<!--<?- partials.top ?>-->");
|
|
11
14
|
export var HTML_SSRDATASCRIPT_SEPARATOR = "<!--<?- SSRDataScript ?>-->";
|
|
12
15
|
export var DOCUMENT_SSR_PLACEHOLDER = encodeURIComponent(HTML_SEPARATOR);
|
|
13
16
|
export var DOCUMENT_CHUNKSMAP_PLACEHOLDER = encodeURIComponent(HTML_CHUNKSMAP_SEPARATOR);
|
|
@@ -2,7 +2,7 @@ import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
|
|
|
2
2
|
import { _ as _object_spread_props } from "@swc/helpers/_/_object_spread_props";
|
|
3
3
|
import { _ as _to_consumable_array } from "@swc/helpers/_/_to_consumable_array";
|
|
4
4
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
5
|
-
import { useContext } from "react";
|
|
5
|
+
import { useContext, useMemo } from "react";
|
|
6
6
|
import { createBrowserRouter, createHashRouter, RouterProvider, createRoutesFromElements, useMatches, useLocation } from "@modern-js/utils/runtime/router";
|
|
7
7
|
import hoistNonReactStatics from "hoist-non-react-statics";
|
|
8
8
|
import { parsedJSONFromElement } from "@modern-js/utils/runtime-browser";
|
|
@@ -63,53 +63,65 @@ export var routerPlugin = function(param) {
|
|
|
63
63
|
});
|
|
64
64
|
}
|
|
65
65
|
var getRouteApp = function() {
|
|
66
|
-
|
|
67
|
-
var _window__SERVER_DATA
|
|
68
|
-
beforeCreateRouter = false;
|
|
69
|
-
routes = createRoutes ? createRoutes() : createRoutesFromElements(renderRoutes({
|
|
70
|
-
routesConfig: finalRouteConfig,
|
|
71
|
-
props: props
|
|
72
|
-
}));
|
|
73
|
-
var runner = api.useHookRunners();
|
|
74
|
-
routes = runner.modifyRoutes(routes);
|
|
66
|
+
var useCreateRouter = function(props) {
|
|
67
|
+
var _window__SERVER_DATA;
|
|
75
68
|
var baseUrl = ((_window__SERVER_DATA = window._SERVER_DATA) === null || _window__SERVER_DATA === void 0 ? void 0 : _window__SERVER_DATA.router.baseUrl) || select(location.pathname);
|
|
76
69
|
var _basename = baseUrl === "/" ? urlJoin(baseUrl, basename) : baseUrl;
|
|
77
70
|
var hydrationData = window._ROUTER_DATA;
|
|
78
|
-
if ((_hydrationData = hydrationData) === null || _hydrationData === void 0 ? void 0 : _hydrationData.errors) {
|
|
79
|
-
hydrationData = _object_spread_props(_object_spread({}, hydrationData), {
|
|
80
|
-
errors: deserializeErrors(hydrationData.errors)
|
|
81
|
-
});
|
|
82
|
-
}
|
|
83
|
-
var router = supportHtml5History ? createBrowserRouter(routes, {
|
|
84
|
-
basename: _basename,
|
|
85
|
-
hydrationData: hydrationData
|
|
86
|
-
}) : createHashRouter(routes, {
|
|
87
|
-
basename: _basename,
|
|
88
|
-
hydrationData: hydrationData
|
|
89
|
-
});
|
|
90
71
|
var runtimeContext = useContext(RuntimeReactContext);
|
|
91
|
-
|
|
72
|
+
var getBlockNavState = runtimeContext.unstable_getBlockNavState;
|
|
73
|
+
return useMemo(function() {
|
|
74
|
+
var _hydrationData;
|
|
75
|
+
if ((_hydrationData = hydrationData) === null || _hydrationData === void 0 ? void 0 : _hydrationData.errors) {
|
|
76
|
+
hydrationData = _object_spread_props(_object_spread({}, hydrationData), {
|
|
77
|
+
errors: deserializeErrors(hydrationData.errors)
|
|
78
|
+
});
|
|
79
|
+
}
|
|
80
|
+
routes = createRoutes ? createRoutes() : createRoutesFromElements(renderRoutes({
|
|
81
|
+
routesConfig: finalRouteConfig,
|
|
82
|
+
props: props
|
|
83
|
+
}));
|
|
84
|
+
var runner = api.useHookRunners();
|
|
85
|
+
routes = runner.modifyRoutes(routes);
|
|
86
|
+
var router = supportHtml5History ? createBrowserRouter(routes, {
|
|
87
|
+
basename: _basename,
|
|
88
|
+
hydrationData: hydrationData
|
|
89
|
+
}) : createHashRouter(routes, {
|
|
90
|
+
basename: _basename,
|
|
91
|
+
hydrationData: hydrationData
|
|
92
|
+
});
|
|
93
|
+
var originSubscribe = router.subscribe;
|
|
94
|
+
router.subscribe = function(listener) {
|
|
95
|
+
var wrapedListener = function() {
|
|
96
|
+
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
97
|
+
args[_key] = arguments[_key];
|
|
98
|
+
}
|
|
99
|
+
var blockRoute = getBlockNavState ? getBlockNavState() : false;
|
|
100
|
+
if (blockRoute) {
|
|
101
|
+
return;
|
|
102
|
+
}
|
|
103
|
+
return listener.apply(void 0, _to_consumable_array(args));
|
|
104
|
+
};
|
|
105
|
+
return originSubscribe(wrapedListener);
|
|
106
|
+
};
|
|
92
107
|
Object.defineProperty(runtimeContext, "remixRouter", {
|
|
93
108
|
get: function get() {
|
|
94
109
|
return router;
|
|
95
|
-
}
|
|
110
|
+
},
|
|
111
|
+
configurable: true
|
|
96
112
|
});
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
return listener.apply(void 0, _to_consumable_array(args));
|
|
110
|
-
};
|
|
111
|
-
return originSubscribe(wrapedListener);
|
|
112
|
-
};
|
|
113
|
+
return router;
|
|
114
|
+
}, [
|
|
115
|
+
finalRouteConfig,
|
|
116
|
+
props,
|
|
117
|
+
_basename,
|
|
118
|
+
hydrationData,
|
|
119
|
+
getBlockNavState
|
|
120
|
+
]);
|
|
121
|
+
};
|
|
122
|
+
return function(props) {
|
|
123
|
+
beforeCreateRouter = false;
|
|
124
|
+
var router = useCreateRouter(props);
|
|
113
125
|
return /* @__PURE__ */ _jsx(App, _object_spread_props(_object_spread({}, props), {
|
|
114
126
|
children: /* @__PURE__ */ _jsx(RouterProvider, {
|
|
115
127
|
router: router
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { useContext } from "react";
|
|
3
|
-
import { DOCUMENT_CHUNKSMAP_PLACEHOLDER, DOCUMENT_SSRDATASCRIPT_PLACEHOLDER } from "./constants";
|
|
3
|
+
import { BODY_PARTICALS_SEPARATOR, DOCUMENT_CHUNKSMAP_PLACEHOLDER, DOCUMENT_SSRDATASCRIPT_PLACEHOLDER } from "./constants";
|
|
4
4
|
import { DocumentStructureContext } from "./DocumentStructureContext";
|
|
5
5
|
import { DefaultRoot } from "./Root";
|
|
6
6
|
export function Body(props) {
|
|
@@ -11,6 +11,7 @@ export function Body(props) {
|
|
|
11
11
|
children: [
|
|
12
12
|
hasSetRoot ? null : /* @__PURE__ */ _jsx(DefaultRoot, {}),
|
|
13
13
|
children,
|
|
14
|
+
`${BODY_PARTICALS_SEPARATOR}`,
|
|
14
15
|
`${DOCUMENT_CHUNKSMAP_PLACEHOLDER}`,
|
|
15
16
|
`${DOCUMENT_SSRDATASCRIPT_PLACEHOLDER}`
|
|
16
17
|
]
|
|
@@ -3,16 +3,18 @@ import { useContext } from "react";
|
|
|
3
3
|
import { DocumentStructureContext } from "./DocumentStructureContext";
|
|
4
4
|
import { Scripts } from "./Scripts";
|
|
5
5
|
import { Links } from "./Links";
|
|
6
|
-
import { DOCUMENT_META_PLACEHOLDER } from "./constants";
|
|
6
|
+
import { DOCUMENT_META_PLACEHOLDER, HEAD_PARTICALS_SEPARATOR, TOP_PARTICALS_SEPARATOR } from "./constants";
|
|
7
7
|
export function Head(props) {
|
|
8
8
|
const { hasSetScripts, hasSetLinks } = useContext(DocumentStructureContext);
|
|
9
9
|
const { children, ...rest } = props;
|
|
10
10
|
return /* @__PURE__ */ _jsxs("head", {
|
|
11
11
|
...rest,
|
|
12
12
|
children: [
|
|
13
|
+
`${TOP_PARTICALS_SEPARATOR}`,
|
|
13
14
|
`${DOCUMENT_META_PLACEHOLDER}`,
|
|
14
15
|
!hasSetLinks && /* @__PURE__ */ _jsx(Links, {}),
|
|
15
16
|
!hasSetScripts && /* @__PURE__ */ _jsx(Scripts, {}),
|
|
17
|
+
`${HEAD_PARTICALS_SEPARATOR}`,
|
|
16
18
|
children
|
|
17
19
|
]
|
|
18
20
|
});
|
|
@@ -4,7 +4,7 @@ import ReactDomServer from "react-dom/server";
|
|
|
4
4
|
import { build } from "esbuild";
|
|
5
5
|
import { createDebugger, findExists, fs } from "@modern-js/utils";
|
|
6
6
|
import { DocumentContext } from "../DocumentContext";
|
|
7
|
-
import { DOCUMENT_SCRIPTS_PLACEHOLDER, DOCUMENT_LINKS_PLACEHOLDER, DOCUMENT_FILE_NAME, DOCUMENT_META_PLACEHOLDER, PLACEHOLDER_REPLACER_MAP, DOC_EXT, DOCUMENT_SSR_PLACEHOLDER, DOCUMENT_CHUNKSMAP_PLACEHOLDER, DOCUMENT_SSRDATASCRIPT_PLACEHOLDER, DOCUMENT_SCRIPT_PLACEHOLDER_START, DOCUMENT_SCRIPT_PLACEHOLDER_END, HTML_SEPARATOR, DOCUMENT_COMMENT_PLACEHOLDER_START, DOCUMENT_COMMENT_PLACEHOLDER_END, DOCUMENT_STYLE_PLACEHOLDER_START, DOCUMENT_STYLE_PLACEHOLDER_END } from "../constants";
|
|
7
|
+
import { DOCUMENT_SCRIPTS_PLACEHOLDER, DOCUMENT_LINKS_PLACEHOLDER, DOCUMENT_FILE_NAME, DOCUMENT_META_PLACEHOLDER, PLACEHOLDER_REPLACER_MAP, DOC_EXT, DOCUMENT_SSR_PLACEHOLDER, DOCUMENT_CHUNKSMAP_PLACEHOLDER, DOCUMENT_SSRDATASCRIPT_PLACEHOLDER, DOCUMENT_SCRIPT_PLACEHOLDER_START, DOCUMENT_SCRIPT_PLACEHOLDER_END, HTML_SEPARATOR, DOCUMENT_COMMENT_PLACEHOLDER_START, DOCUMENT_COMMENT_PLACEHOLDER_END, DOCUMENT_STYLE_PLACEHOLDER_START, DOCUMENT_STYLE_PLACEHOLDER_END, TOP_PARTICALS_SEPARATOR, HEAD_PARTICALS_SEPARATOR, BODY_PARTICALS_SEPARATOR } from "../constants";
|
|
8
8
|
const debug = createDebugger("html_genarate");
|
|
9
9
|
export const getDocumenByEntryName = function(entrypoints, entryName, fallbackDir) {
|
|
10
10
|
var _entrypoints_find;
|
|
@@ -45,7 +45,7 @@ export const documentPlugin = () => ({
|
|
|
45
45
|
return null;
|
|
46
46
|
}
|
|
47
47
|
return async ({ htmlWebpackPlugin }) => {
|
|
48
|
-
var _tsConfig;
|
|
48
|
+
var _tsConfig, _partialsByEntrypoint;
|
|
49
49
|
const config = api.useResolvedConfigContext();
|
|
50
50
|
const documentParams = getDocParams({
|
|
51
51
|
config,
|
|
@@ -110,10 +110,17 @@ export const documentPlugin = () => ({
|
|
|
110
110
|
}, React.createElement(Document, null));
|
|
111
111
|
let html = ReactDomServer.renderToStaticMarkup(HTMLElement);
|
|
112
112
|
debug("entry %s's document jsx rendered html: %o", entryName, html);
|
|
113
|
+
const { partialsByEntrypoint } = api.useAppContext();
|
|
113
114
|
const scripts = [
|
|
114
115
|
htmlWebpackPlugin.tags.headTags.filter((item) => item.tagName === "script").join(""),
|
|
115
116
|
htmlWebpackPlugin.tags.bodyTags.toString()
|
|
116
117
|
].join("");
|
|
118
|
+
if ((_partialsByEntrypoint = partialsByEntrypoint) === null || _partialsByEntrypoint === void 0 ? void 0 : _partialsByEntrypoint[entryName]) {
|
|
119
|
+
const partialsTop = partialsByEntrypoint[entryName].top.join("\n");
|
|
120
|
+
const partialsHead = partialsByEntrypoint[entryName].head.join("\n");
|
|
121
|
+
const partialsBody = partialsByEntrypoint[entryName].body.join("\n");
|
|
122
|
+
html = html.replace(TOP_PARTICALS_SEPARATOR, partialsTop).replace(HEAD_PARTICALS_SEPARATOR, partialsHead).replace(BODY_PARTICALS_SEPARATOR, partialsBody);
|
|
123
|
+
}
|
|
117
124
|
const links = [
|
|
118
125
|
htmlWebpackPlugin.tags.headTags.filter((item) => item.tagName === "link").join("")
|
|
119
126
|
].join("");
|
|
@@ -7,6 +7,9 @@ export const DOC_EXT = [
|
|
|
7
7
|
];
|
|
8
8
|
export const DOCUMENT_META_PLACEHOLDER = encodeURIComponent("<%= meta %>");
|
|
9
9
|
export const HTML_SEPARATOR = "<!--<?- html ?>-->";
|
|
10
|
+
export const HEAD_PARTICALS_SEPARATOR = encodeURIComponent("<!--<?- partials.head ?>-->");
|
|
11
|
+
export const BODY_PARTICALS_SEPARATOR = encodeURIComponent("<!--<?- partials.body ?>-->");
|
|
12
|
+
export const TOP_PARTICALS_SEPARATOR = encodeURIComponent("<!--<?- partials.top ?>-->");
|
|
10
13
|
export const HTML_SSRDATASCRIPT_SEPARATOR = "<!--<?- SSRDataScript ?>-->";
|
|
11
14
|
export const DOCUMENT_SSR_PLACEHOLDER = encodeURIComponent(HTML_SEPARATOR);
|
|
12
15
|
export const DOCUMENT_CHUNKSMAP_PLACEHOLDER = encodeURIComponent(HTML_CHUNKSMAP_SEPARATOR);
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import { useContext } from "react";
|
|
2
|
+
import { useContext, useMemo } from "react";
|
|
3
3
|
import { createBrowserRouter, createHashRouter, RouterProvider, createRoutesFromElements, useMatches, useLocation } from "@modern-js/utils/runtime/router";
|
|
4
4
|
import hoistNonReactStatics from "hoist-non-react-statics";
|
|
5
5
|
import { parsedJSONFromElement } from "@modern-js/utils/runtime-browser";
|
|
@@ -53,51 +53,63 @@ export const routerPlugin = ({ serverBase = [], supportHtml5History = true, base
|
|
|
53
53
|
});
|
|
54
54
|
}
|
|
55
55
|
const getRouteApp = () => {
|
|
56
|
-
|
|
57
|
-
var _window__SERVER_DATA
|
|
58
|
-
beforeCreateRouter = false;
|
|
59
|
-
routes = createRoutes ? createRoutes() : createRoutesFromElements(renderRoutes({
|
|
60
|
-
routesConfig: finalRouteConfig,
|
|
61
|
-
props
|
|
62
|
-
}));
|
|
63
|
-
const runner = api.useHookRunners();
|
|
64
|
-
routes = runner.modifyRoutes(routes);
|
|
56
|
+
const useCreateRouter = (props) => {
|
|
57
|
+
var _window__SERVER_DATA;
|
|
65
58
|
const baseUrl = ((_window__SERVER_DATA = window._SERVER_DATA) === null || _window__SERVER_DATA === void 0 ? void 0 : _window__SERVER_DATA.router.baseUrl) || select(location.pathname);
|
|
66
59
|
const _basename = baseUrl === "/" ? urlJoin(baseUrl, basename) : baseUrl;
|
|
67
60
|
let hydrationData = window._ROUTER_DATA;
|
|
68
|
-
if ((_hydrationData = hydrationData) === null || _hydrationData === void 0 ? void 0 : _hydrationData.errors) {
|
|
69
|
-
hydrationData = {
|
|
70
|
-
...hydrationData,
|
|
71
|
-
errors: deserializeErrors(hydrationData.errors)
|
|
72
|
-
};
|
|
73
|
-
}
|
|
74
|
-
const router = supportHtml5History ? createBrowserRouter(routes, {
|
|
75
|
-
basename: _basename,
|
|
76
|
-
hydrationData
|
|
77
|
-
}) : createHashRouter(routes, {
|
|
78
|
-
basename: _basename,
|
|
79
|
-
hydrationData
|
|
80
|
-
});
|
|
81
61
|
const runtimeContext = useContext(RuntimeReactContext);
|
|
82
|
-
|
|
62
|
+
const { unstable_getBlockNavState: getBlockNavState } = runtimeContext;
|
|
63
|
+
return useMemo(() => {
|
|
64
|
+
var _hydrationData;
|
|
65
|
+
if ((_hydrationData = hydrationData) === null || _hydrationData === void 0 ? void 0 : _hydrationData.errors) {
|
|
66
|
+
hydrationData = {
|
|
67
|
+
...hydrationData,
|
|
68
|
+
errors: deserializeErrors(hydrationData.errors)
|
|
69
|
+
};
|
|
70
|
+
}
|
|
71
|
+
routes = createRoutes ? createRoutes() : createRoutesFromElements(renderRoutes({
|
|
72
|
+
routesConfig: finalRouteConfig,
|
|
73
|
+
props
|
|
74
|
+
}));
|
|
75
|
+
const runner = api.useHookRunners();
|
|
76
|
+
routes = runner.modifyRoutes(routes);
|
|
77
|
+
const router = supportHtml5History ? createBrowserRouter(routes, {
|
|
78
|
+
basename: _basename,
|
|
79
|
+
hydrationData
|
|
80
|
+
}) : createHashRouter(routes, {
|
|
81
|
+
basename: _basename,
|
|
82
|
+
hydrationData
|
|
83
|
+
});
|
|
84
|
+
const originSubscribe = router.subscribe;
|
|
85
|
+
router.subscribe = (listener) => {
|
|
86
|
+
const wrapedListener = (...args) => {
|
|
87
|
+
const blockRoute = getBlockNavState ? getBlockNavState() : false;
|
|
88
|
+
if (blockRoute) {
|
|
89
|
+
return;
|
|
90
|
+
}
|
|
91
|
+
return listener(...args);
|
|
92
|
+
};
|
|
93
|
+
return originSubscribe(wrapedListener);
|
|
94
|
+
};
|
|
83
95
|
Object.defineProperty(runtimeContext, "remixRouter", {
|
|
84
96
|
get() {
|
|
85
97
|
return router;
|
|
86
|
-
}
|
|
98
|
+
},
|
|
99
|
+
configurable: true
|
|
87
100
|
});
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
};
|
|
101
|
+
return router;
|
|
102
|
+
}, [
|
|
103
|
+
finalRouteConfig,
|
|
104
|
+
props,
|
|
105
|
+
_basename,
|
|
106
|
+
hydrationData,
|
|
107
|
+
getBlockNavState
|
|
108
|
+
]);
|
|
109
|
+
};
|
|
110
|
+
return (props) => {
|
|
111
|
+
beforeCreateRouter = false;
|
|
112
|
+
const router = useCreateRouter(props);
|
|
101
113
|
return /* @__PURE__ */ _jsx(App, {
|
|
102
114
|
...props,
|
|
103
115
|
children: /* @__PURE__ */ _jsx(RouterProvider, {
|
|
@@ -1,6 +1,9 @@
|
|
|
1
1
|
export declare const DOC_EXT: string[];
|
|
2
2
|
export declare const DOCUMENT_META_PLACEHOLDER: string;
|
|
3
3
|
export declare const HTML_SEPARATOR = "<!--<?- html ?>-->";
|
|
4
|
+
export declare const HEAD_PARTICALS_SEPARATOR: string;
|
|
5
|
+
export declare const BODY_PARTICALS_SEPARATOR: string;
|
|
6
|
+
export declare const TOP_PARTICALS_SEPARATOR: string;
|
|
4
7
|
export declare const HTML_SSRDATASCRIPT_SEPARATOR = "<!--<?- SSRDataScript ?>-->";
|
|
5
8
|
export declare const DOCUMENT_SSR_PLACEHOLDER: string;
|
|
6
9
|
export declare const DOCUMENT_CHUNKSMAP_PLACEHOLDER: string;
|
package/package.json
CHANGED
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
"modern",
|
|
16
16
|
"modern.js"
|
|
17
17
|
],
|
|
18
|
-
"version": "2.
|
|
18
|
+
"version": "2.31.0",
|
|
19
19
|
"engines": {
|
|
20
20
|
"node": ">=14.17.6"
|
|
21
21
|
},
|
|
@@ -173,9 +173,9 @@
|
|
|
173
173
|
"redux-logger": "^3.0.6",
|
|
174
174
|
"styled-components": "^5.3.1",
|
|
175
175
|
"@swc/helpers": "0.5.1",
|
|
176
|
-
"@modern-js/plugin": "2.
|
|
177
|
-
"@modern-js/
|
|
178
|
-
"@modern-js/
|
|
176
|
+
"@modern-js/plugin": "2.31.0",
|
|
177
|
+
"@modern-js/types": "2.31.0",
|
|
178
|
+
"@modern-js/utils": "2.31.0"
|
|
179
179
|
},
|
|
180
180
|
"peerDependencies": {
|
|
181
181
|
"react": ">=17",
|
|
@@ -196,11 +196,11 @@
|
|
|
196
196
|
"ts-jest": "^29.1.0",
|
|
197
197
|
"typescript": "^5",
|
|
198
198
|
"webpack": "^5.88.1",
|
|
199
|
-
"@modern-js/app-tools": "2.
|
|
200
|
-
"@modern-js/
|
|
201
|
-
"@modern-js/core": "2.
|
|
202
|
-
"@scripts/jest-config": "2.
|
|
203
|
-
"@scripts/build": "2.
|
|
199
|
+
"@modern-js/app-tools": "2.31.0",
|
|
200
|
+
"@modern-js/core": "2.31.0",
|
|
201
|
+
"@modern-js/server-core": "2.31.0",
|
|
202
|
+
"@scripts/jest-config": "2.31.0",
|
|
203
|
+
"@scripts/build": "2.31.0"
|
|
204
204
|
},
|
|
205
205
|
"sideEffects": false,
|
|
206
206
|
"publishConfig": {
|