@modern-js/runtime 1.18.1 → 1.20.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 +25 -0
- package/dist/js/modern/ssr/index.js +1 -1
- package/dist/js/modern/ssr/index.node.js +5 -18
- package/dist/js/modern/ssr/serverRender/entry.js +15 -3
- package/dist/js/modern/ssr/serverRender/index.js +3 -2
- package/dist/js/modern/ssr/serverRender/loadable.js +14 -2
- package/dist/js/modern/ssr/utils.js +9 -0
- package/dist/js/node/ssr/index.js +1 -1
- package/dist/js/node/ssr/index.node.js +4 -16
- package/dist/js/node/ssr/serverRender/entry.js +15 -3
- package/dist/js/node/ssr/serverRender/index.js +3 -2
- package/dist/js/node/ssr/serverRender/loadable.js +15 -2
- package/dist/js/node/ssr/utils.js +14 -2
- package/dist/js/treeshaking/ssr/index.js +1 -1
- package/dist/js/treeshaking/ssr/index.node.js +8 -24
- package/dist/js/treeshaking/ssr/serverRender/entry.js +13 -3
- package/dist/js/treeshaking/ssr/serverRender/index.js +6 -11
- package/dist/js/treeshaking/ssr/serverRender/loadable.js +13 -2
- package/dist/js/treeshaking/ssr/utils.js +9 -0
- package/dist/types/router/runtime/DefaultNotFound.d.ts +0 -1
- package/dist/types/router/runtime/utils.d.ts +0 -1
- package/dist/types/ssr/index.d.ts +2 -2
- package/dist/types/ssr/index.node.d.ts +2 -1
- package/dist/types/ssr/serverRender/entry.d.ts +4 -1
- package/dist/types/ssr/serverRender/index.d.ts +2 -2
- package/dist/types/ssr/serverRender/type.d.ts +5 -0
- package/dist/types/ssr/utils.d.ts +2 -1
- package/package.json +10 -11
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,30 @@
|
|
|
1
1
|
# @modern-js/runtime
|
|
2
2
|
|
|
3
|
+
## 1.20.0
|
|
4
|
+
|
|
5
|
+
### Patch Changes
|
|
6
|
+
|
|
7
|
+
- b57d5ff: fix: ssr runtime plugin need default config
|
|
8
|
+
fix: ssr 运行时插件需要传入默认配置
|
|
9
|
+
- 715df7a: feat: support loadable scripts add crossorigin attribute
|
|
10
|
+
feat: SSR 支持 loadable 脚本添加 crossorigin 属性
|
|
11
|
+
- Updated dependencies [d5d570b]
|
|
12
|
+
- Updated dependencies [4ddc185]
|
|
13
|
+
- Updated dependencies [df8ee7e]
|
|
14
|
+
- Updated dependencies [077aef8]
|
|
15
|
+
- Updated dependencies [8c05089]
|
|
16
|
+
- @modern-js/utils@1.20.0
|
|
17
|
+
- @modern-js/webpack@1.20.0
|
|
18
|
+
- @modern-js/plugin@1.20.0
|
|
19
|
+
|
|
20
|
+
## 1.19.0
|
|
21
|
+
|
|
22
|
+
### Patch Changes
|
|
23
|
+
|
|
24
|
+
- @modern-js/webpack@1.19.0
|
|
25
|
+
- @modern-js/plugin@1.19.0
|
|
26
|
+
- @modern-js/utils@1.19.0
|
|
27
|
+
|
|
3
28
|
## 1.18.1
|
|
4
29
|
|
|
5
30
|
### Patch Changes
|
|
@@ -12,7 +12,7 @@ import { formatClient, mockResponse } from "./utils";
|
|
|
12
12
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
13
13
|
const IS_REACT18 = process.env.IS_REACT18 === 'true';
|
|
14
14
|
|
|
15
|
-
const ssr =
|
|
15
|
+
const ssr = _ => ({
|
|
16
16
|
name: '@modern-js/plugin-ssr',
|
|
17
17
|
setup: () => {
|
|
18
18
|
const mockResp = mockResponse();
|
|
@@ -4,17 +4,13 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
|
|
|
4
4
|
|
|
5
5
|
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; }
|
|
6
6
|
|
|
7
|
-
/* eslint-disable @typescript-eslint/no-var-requires */
|
|
8
|
-
|
|
9
|
-
/* eslint-disable @typescript-eslint/no-require-imports */
|
|
10
|
-
import path from 'path';
|
|
11
7
|
import { registerPrefetch } from "../core";
|
|
12
|
-
import {
|
|
8
|
+
import { render } from "./serverRender";
|
|
13
9
|
import prefetch from "./prefetch";
|
|
14
10
|
import { formatServer } from "./utils";
|
|
15
11
|
const registeredApps = new WeakSet();
|
|
16
12
|
|
|
17
|
-
const plugin = () => ({
|
|
13
|
+
const plugin = (config = {}) => ({
|
|
18
14
|
name: '@modern-js/plugin-ssr',
|
|
19
15
|
setup: () => {
|
|
20
16
|
return {
|
|
@@ -27,14 +23,8 @@ const plugin = () => ({
|
|
|
27
23
|
registeredApps.add(App);
|
|
28
24
|
}
|
|
29
25
|
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
const html = await require("./serverRender").render(context, (context === null || context === void 0 ? void 0 : (_context$ssrContext = context.ssrContext) === null || _context$ssrContext === void 0 ? void 0 : _context$ssrContext.distDir) || path.join(process.cwd(), 'dist'), App);
|
|
34
|
-
return html;
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
return null;
|
|
26
|
+
const html = await render(context, config, App);
|
|
27
|
+
return html;
|
|
38
28
|
},
|
|
39
29
|
|
|
40
30
|
init({
|
|
@@ -75,7 +65,4 @@ const plugin = () => ({
|
|
|
75
65
|
});
|
|
76
66
|
|
|
77
67
|
export default plugin;
|
|
78
|
-
export * from "./react";
|
|
79
|
-
/* eslint-enable @typescript-eslint/no-require-imports */
|
|
80
|
-
|
|
81
|
-
/* eslint-enable @typescript-eslint/no-var-requires */
|
|
68
|
+
export * from "./react";
|
|
@@ -49,16 +49,26 @@ export default class Entry {
|
|
|
49
49
|
|
|
50
50
|
_defineProperty(this, "fragments", void 0);
|
|
51
51
|
|
|
52
|
+
_defineProperty(this, "pluginConfig", void 0);
|
|
53
|
+
|
|
54
|
+
_defineProperty(this, "host", void 0);
|
|
55
|
+
|
|
52
56
|
const {
|
|
53
|
-
ctx
|
|
57
|
+
ctx,
|
|
58
|
+
config
|
|
54
59
|
} = options;
|
|
55
60
|
const {
|
|
56
61
|
entryName,
|
|
57
|
-
template: templateHTML
|
|
62
|
+
template: templateHTML,
|
|
63
|
+
request: {
|
|
64
|
+
host
|
|
65
|
+
}
|
|
58
66
|
} = ctx;
|
|
59
67
|
this.fragments = toFragments(templateHTML);
|
|
60
68
|
this.entryName = entryName;
|
|
69
|
+
this.host = host;
|
|
61
70
|
this.App = options.App;
|
|
71
|
+
this.pluginConfig = config;
|
|
62
72
|
this.metrics = ctx.metrics;
|
|
63
73
|
this.logger = ctx.logger;
|
|
64
74
|
this.result = {
|
|
@@ -150,8 +160,10 @@ export default class Entry {
|
|
|
150
160
|
|
|
151
161
|
const renderContext = {
|
|
152
162
|
loadableManifest: path.resolve(ssrContext.distDir, LOADABLE_STATS_FILE),
|
|
163
|
+
host: this.host,
|
|
153
164
|
result: this.result,
|
|
154
|
-
entryName: this.entryName
|
|
165
|
+
entryName: this.entryName,
|
|
166
|
+
config: this.pluginConfig
|
|
155
167
|
};
|
|
156
168
|
html = reduce(App, renderContext, [styledComponentRenderer.toHtml, loadableRenderer.toHtml, jsx => ReactDomServer.renderToString(jsx)]);
|
|
157
169
|
const cost = end();
|
|
@@ -2,14 +2,15 @@ import { run } from '@modern-js/utils/ssr';
|
|
|
2
2
|
import { PreRender } from "../react/prerender";
|
|
3
3
|
import SSREntry from "./entry";
|
|
4
4
|
import { time } from "./measure";
|
|
5
|
-
export const render = async (ctx,
|
|
5
|
+
export const render = async (ctx, config, App) => {
|
|
6
6
|
const {
|
|
7
7
|
ssrContext
|
|
8
8
|
} = ctx;
|
|
9
9
|
return run(ssrContext.request.headers, async () => {
|
|
10
10
|
const entry = new SSREntry({
|
|
11
11
|
ctx: ssrContext,
|
|
12
|
-
App
|
|
12
|
+
App,
|
|
13
|
+
config
|
|
13
14
|
});
|
|
14
15
|
entry.metrics.emitCounter('app.visit.count', 1);
|
|
15
16
|
const end = time();
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import path from 'path';
|
|
2
2
|
import { ChunkExtractor } from '@loadable/server';
|
|
3
|
+
import { isCrossOrigin } from "../utils";
|
|
3
4
|
|
|
4
5
|
function getLoadableScripts(extractor) {
|
|
5
6
|
const check = scripts => (scripts || '').includes('__LOADABLE_REQUIRED_CHUNKS___ext');
|
|
@@ -19,7 +20,9 @@ export const toHtml = (jsx, renderer, next) => {
|
|
|
19
20
|
loadableManifest,
|
|
20
21
|
result: {
|
|
21
22
|
chunksMap
|
|
22
|
-
}
|
|
23
|
+
},
|
|
24
|
+
host,
|
|
25
|
+
config = {}
|
|
23
26
|
} = renderer;
|
|
24
27
|
|
|
25
28
|
if (!loadableManifest || chunksMap.js) {
|
|
@@ -38,7 +41,16 @@ export const toHtml = (jsx, renderer, next) => {
|
|
|
38
41
|
const fileType = path.extname(v.url).slice(1);
|
|
39
42
|
|
|
40
43
|
if (fileType === 'js') {
|
|
41
|
-
|
|
44
|
+
const props = [];
|
|
45
|
+
const {
|
|
46
|
+
crossorigin
|
|
47
|
+
} = config;
|
|
48
|
+
|
|
49
|
+
if (crossorigin && isCrossOrigin(v.url, host)) {
|
|
50
|
+
props.push(`crossorigin="${crossorigin === true ? 'anonymous' : crossorigin}"`);
|
|
51
|
+
}
|
|
52
|
+
|
|
53
|
+
chunksMap[fileType] += `<script src="${v.url}" ${props.join(' ')}></script>`;
|
|
42
54
|
} else if (fileType === 'css') {
|
|
43
55
|
chunksMap[fileType] += `<link href="${v.url}" rel="stylesheet" />`;
|
|
44
56
|
}
|
|
@@ -54,4 +54,13 @@ export const mockResponse = () => {
|
|
|
54
54
|
}
|
|
55
55
|
|
|
56
56
|
};
|
|
57
|
+
};
|
|
58
|
+
export const isCrossOrigin = (url, base) => {
|
|
59
|
+
if (url.startsWith('/') || url.startsWith('./')) {
|
|
60
|
+
return false;
|
|
61
|
+
} else if (!url.includes(base)) {
|
|
62
|
+
return true;
|
|
63
|
+
} else {
|
|
64
|
+
return false;
|
|
65
|
+
}
|
|
57
66
|
};
|
|
@@ -42,7 +42,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
|
|
|
42
42
|
|
|
43
43
|
const IS_REACT18 = process.env.IS_REACT18 === 'true';
|
|
44
44
|
|
|
45
|
-
const ssr =
|
|
45
|
+
const ssr = _ => ({
|
|
46
46
|
name: '@modern-js/plugin-ssr',
|
|
47
47
|
setup: () => {
|
|
48
48
|
const mockResp = (0, _utils.mockResponse)();
|
|
@@ -6,11 +6,9 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
var _exportNames = {};
|
|
7
7
|
exports.default = void 0;
|
|
8
8
|
|
|
9
|
-
var _path = _interopRequireDefault(require("path"));
|
|
10
|
-
|
|
11
9
|
var _core = require("../core");
|
|
12
10
|
|
|
13
|
-
var
|
|
11
|
+
var _serverRender = require("./serverRender");
|
|
14
12
|
|
|
15
13
|
var _prefetch = _interopRequireDefault(require("./prefetch"));
|
|
16
14
|
|
|
@@ -40,7 +38,7 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
|
|
|
40
38
|
|
|
41
39
|
const registeredApps = new WeakSet();
|
|
42
40
|
|
|
43
|
-
const plugin = () => ({
|
|
41
|
+
const plugin = (config = {}) => ({
|
|
44
42
|
name: '@modern-js/plugin-ssr',
|
|
45
43
|
setup: () => {
|
|
46
44
|
return {
|
|
@@ -53,14 +51,8 @@ const plugin = () => ({
|
|
|
53
51
|
registeredApps.add(App);
|
|
54
52
|
}
|
|
55
53
|
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
const html = await require("./serverRender").render(context, (context === null || context === void 0 ? void 0 : (_context$ssrContext = context.ssrContext) === null || _context$ssrContext === void 0 ? void 0 : _context$ssrContext.distDir) || _path.default.join(process.cwd(), 'dist'), App);
|
|
60
|
-
return html;
|
|
61
|
-
}
|
|
62
|
-
|
|
63
|
-
return null;
|
|
54
|
+
const html = await (0, _serverRender.render)(context, config, App);
|
|
55
|
+
return html;
|
|
64
56
|
},
|
|
65
57
|
|
|
66
58
|
init({
|
|
@@ -101,8 +93,4 @@ const plugin = () => ({
|
|
|
101
93
|
});
|
|
102
94
|
|
|
103
95
|
var _default = plugin;
|
|
104
|
-
/* eslint-enable @typescript-eslint/no-require-imports */
|
|
105
|
-
|
|
106
|
-
/* eslint-enable @typescript-eslint/no-var-requires */
|
|
107
|
-
|
|
108
96
|
exports.default = _default;
|
|
@@ -74,16 +74,26 @@ class Entry {
|
|
|
74
74
|
|
|
75
75
|
_defineProperty(this, "fragments", void 0);
|
|
76
76
|
|
|
77
|
+
_defineProperty(this, "pluginConfig", void 0);
|
|
78
|
+
|
|
79
|
+
_defineProperty(this, "host", void 0);
|
|
80
|
+
|
|
77
81
|
const {
|
|
78
|
-
ctx
|
|
82
|
+
ctx,
|
|
83
|
+
config
|
|
79
84
|
} = options;
|
|
80
85
|
const {
|
|
81
86
|
entryName,
|
|
82
|
-
template: templateHTML
|
|
87
|
+
template: templateHTML,
|
|
88
|
+
request: {
|
|
89
|
+
host
|
|
90
|
+
}
|
|
83
91
|
} = ctx;
|
|
84
92
|
this.fragments = (0, _template.toFragments)(templateHTML);
|
|
85
93
|
this.entryName = entryName;
|
|
94
|
+
this.host = host;
|
|
86
95
|
this.App = options.App;
|
|
96
|
+
this.pluginConfig = config;
|
|
87
97
|
this.metrics = ctx.metrics;
|
|
88
98
|
this.logger = ctx.logger;
|
|
89
99
|
this.result = {
|
|
@@ -177,8 +187,10 @@ class Entry {
|
|
|
177
187
|
|
|
178
188
|
const renderContext = {
|
|
179
189
|
loadableManifest: _path.default.resolve(ssrContext.distDir, _constants.LOADABLE_STATS_FILE),
|
|
190
|
+
host: this.host,
|
|
180
191
|
result: this.result,
|
|
181
|
-
entryName: this.entryName
|
|
192
|
+
entryName: this.entryName,
|
|
193
|
+
config: this.pluginConfig
|
|
182
194
|
};
|
|
183
195
|
html = (0, _reduce.reduce)(App, renderContext, [styledComponentRenderer.toHtml, loadableRenderer.toHtml, jsx => _server.default.renderToString(jsx)]);
|
|
184
196
|
const cost = end();
|
|
@@ -15,14 +15,15 @@ var _measure = require("./measure");
|
|
|
15
15
|
|
|
16
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
17
|
|
|
18
|
-
const render = async (ctx,
|
|
18
|
+
const render = async (ctx, config, App) => {
|
|
19
19
|
const {
|
|
20
20
|
ssrContext
|
|
21
21
|
} = ctx;
|
|
22
22
|
return (0, _ssr.run)(ssrContext.request.headers, async () => {
|
|
23
23
|
const entry = new _entry.default({
|
|
24
24
|
ctx: ssrContext,
|
|
25
|
-
App
|
|
25
|
+
App,
|
|
26
|
+
config
|
|
26
27
|
});
|
|
27
28
|
entry.metrics.emitCounter('app.visit.count', 1);
|
|
28
29
|
const end = (0, _measure.time)();
|
|
@@ -9,6 +9,8 @@ var _path = _interopRequireDefault(require("path"));
|
|
|
9
9
|
|
|
10
10
|
var _server = require("@loadable/server");
|
|
11
11
|
|
|
12
|
+
var _utils = require("../utils");
|
|
13
|
+
|
|
12
14
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
15
|
|
|
14
16
|
function getLoadableScripts(extractor) {
|
|
@@ -29,7 +31,9 @@ const toHtml = (jsx, renderer, next) => {
|
|
|
29
31
|
loadableManifest,
|
|
30
32
|
result: {
|
|
31
33
|
chunksMap
|
|
32
|
-
}
|
|
34
|
+
},
|
|
35
|
+
host,
|
|
36
|
+
config = {}
|
|
33
37
|
} = renderer;
|
|
34
38
|
|
|
35
39
|
if (!loadableManifest || chunksMap.js) {
|
|
@@ -48,7 +52,16 @@ const toHtml = (jsx, renderer, next) => {
|
|
|
48
52
|
const fileType = _path.default.extname(v.url).slice(1);
|
|
49
53
|
|
|
50
54
|
if (fileType === 'js') {
|
|
51
|
-
|
|
55
|
+
const props = [];
|
|
56
|
+
const {
|
|
57
|
+
crossorigin
|
|
58
|
+
} = config;
|
|
59
|
+
|
|
60
|
+
if (crossorigin && (0, _utils.isCrossOrigin)(v.url, host)) {
|
|
61
|
+
props.push(`crossorigin="${crossorigin === true ? 'anonymous' : crossorigin}"`);
|
|
62
|
+
}
|
|
63
|
+
|
|
64
|
+
chunksMap[fileType] += `<script src="${v.url}" ${props.join(' ')}></script>`;
|
|
52
65
|
} else if (fileType === 'css') {
|
|
53
66
|
chunksMap[fileType] += `<link href="${v.url}" rel="stylesheet" />`;
|
|
54
67
|
}
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
|
-
exports.mockResponse = exports.formatServer = exports.formatClient = void 0;
|
|
6
|
+
exports.mockResponse = exports.isCrossOrigin = exports.formatServer = exports.formatClient = void 0;
|
|
7
7
|
|
|
8
8
|
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; }
|
|
9
9
|
|
|
@@ -68,4 +68,16 @@ const mockResponse = () => {
|
|
|
68
68
|
};
|
|
69
69
|
};
|
|
70
70
|
|
|
71
|
-
exports.mockResponse = mockResponse;
|
|
71
|
+
exports.mockResponse = mockResponse;
|
|
72
|
+
|
|
73
|
+
const isCrossOrigin = (url, base) => {
|
|
74
|
+
if (url.startsWith('/') || url.startsWith('./')) {
|
|
75
|
+
return false;
|
|
76
|
+
} else if (!url.includes(base)) {
|
|
77
|
+
return true;
|
|
78
|
+
} else {
|
|
79
|
+
return false;
|
|
80
|
+
}
|
|
81
|
+
};
|
|
82
|
+
|
|
83
|
+
exports.isCrossOrigin = isCrossOrigin;
|
|
@@ -9,7 +9,7 @@ import { formatClient, mockResponse } from "./utils";
|
|
|
9
9
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
10
10
|
var IS_REACT18 = process.env.IS_REACT18 === 'true';
|
|
11
11
|
|
|
12
|
-
var ssr = function ssr() {
|
|
12
|
+
var ssr = function ssr(_) {
|
|
13
13
|
return {
|
|
14
14
|
name: '@modern-js/plugin-ssr',
|
|
15
15
|
setup: function setup() {
|
|
@@ -1,26 +1,21 @@
|
|
|
1
1
|
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
|
|
2
2
|
import _regeneratorRuntime from "@babel/runtime/helpers/esm/regeneratorRuntime";
|
|
3
3
|
import _asyncToGenerator from "@babel/runtime/helpers/esm/asyncToGenerator";
|
|
4
|
-
|
|
5
|
-
/* eslint-disable @typescript-eslint/no-var-requires */
|
|
6
|
-
|
|
7
|
-
/* eslint-disable @typescript-eslint/no-require-imports */
|
|
8
|
-
import path from 'path';
|
|
9
4
|
import { registerPrefetch } from "../core";
|
|
10
|
-
import {
|
|
5
|
+
import { render } from "./serverRender";
|
|
11
6
|
import prefetch from "./prefetch";
|
|
12
7
|
import { formatServer } from "./utils";
|
|
13
8
|
var registeredApps = new WeakSet();
|
|
14
9
|
|
|
15
10
|
var plugin = function plugin() {
|
|
11
|
+
var config = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
16
12
|
return {
|
|
17
13
|
name: '@modern-js/plugin-ssr',
|
|
18
14
|
setup: function setup() {
|
|
19
15
|
return {
|
|
20
16
|
server: function () {
|
|
21
17
|
var _server = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(_ref) {
|
|
22
|
-
var App, context,
|
|
23
|
-
|
|
18
|
+
var App, context, html;
|
|
24
19
|
return _regeneratorRuntime().wrap(function _callee$(_context2) {
|
|
25
20
|
while (1) {
|
|
26
21
|
switch (_context2.prev = _context2.next) {
|
|
@@ -34,22 +29,14 @@ var plugin = function plugin() {
|
|
|
34
29
|
registeredApps.add(App);
|
|
35
30
|
}
|
|
36
31
|
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
break;
|
|
40
|
-
}
|
|
32
|
+
_context2.next = 4;
|
|
33
|
+
return render(context, config, App);
|
|
41
34
|
|
|
42
|
-
|
|
43
|
-
return require("./serverRender").render(context, (context === null || context === void 0 ? void 0 : (_context$ssrContext = context.ssrContext) === null || _context$ssrContext === void 0 ? void 0 : _context$ssrContext.distDir) || path.join(process.cwd(), 'dist'), App);
|
|
44
|
-
|
|
45
|
-
case 5:
|
|
35
|
+
case 4:
|
|
46
36
|
html = _context2.sent;
|
|
47
37
|
return _context2.abrupt("return", html);
|
|
48
38
|
|
|
49
|
-
case
|
|
50
|
-
return _context2.abrupt("return", null);
|
|
51
|
-
|
|
52
|
-
case 8:
|
|
39
|
+
case 6:
|
|
53
40
|
case "end":
|
|
54
41
|
return _context2.stop();
|
|
55
42
|
}
|
|
@@ -97,7 +84,4 @@ var plugin = function plugin() {
|
|
|
97
84
|
};
|
|
98
85
|
|
|
99
86
|
export default plugin;
|
|
100
|
-
export * from "./react";
|
|
101
|
-
/* eslint-enable @typescript-eslint/no-require-imports */
|
|
102
|
-
|
|
103
|
-
/* eslint-enable @typescript-eslint/no-var-requires */
|
|
87
|
+
export * from "./react";
|
|
@@ -53,12 +53,20 @@ var Entry = /*#__PURE__*/function () {
|
|
|
53
53
|
|
|
54
54
|
_defineProperty(this, "fragments", void 0);
|
|
55
55
|
|
|
56
|
-
|
|
56
|
+
_defineProperty(this, "pluginConfig", void 0);
|
|
57
|
+
|
|
58
|
+
_defineProperty(this, "host", void 0);
|
|
59
|
+
|
|
60
|
+
var ctx = options.ctx,
|
|
61
|
+
config = options.config;
|
|
57
62
|
var entryName = ctx.entryName,
|
|
58
|
-
templateHTML = ctx.template
|
|
63
|
+
templateHTML = ctx.template,
|
|
64
|
+
host = ctx.request.host;
|
|
59
65
|
this.fragments = toFragments(templateHTML);
|
|
60
66
|
this.entryName = entryName;
|
|
67
|
+
this.host = host;
|
|
61
68
|
this.App = options.App;
|
|
69
|
+
this.pluginConfig = config;
|
|
62
70
|
this.metrics = ctx.metrics;
|
|
63
71
|
this.logger = ctx.logger;
|
|
64
72
|
this.result = {
|
|
@@ -233,8 +241,10 @@ var Entry = /*#__PURE__*/function () {
|
|
|
233
241
|
|
|
234
242
|
var renderContext = {
|
|
235
243
|
loadableManifest: path.resolve(ssrContext.distDir, LOADABLE_STATS_FILE),
|
|
244
|
+
host: this.host,
|
|
236
245
|
result: this.result,
|
|
237
|
-
entryName: this.entryName
|
|
246
|
+
entryName: this.entryName,
|
|
247
|
+
config: this.pluginConfig
|
|
238
248
|
};
|
|
239
249
|
html = reduce(App, renderContext, [styledComponentRenderer.toHtml, loadableRenderer.toHtml, function (jsx) {
|
|
240
250
|
return ReactDomServer.renderToString(jsx);
|
|
@@ -5,18 +5,12 @@ import { PreRender } from "../react/prerender";
|
|
|
5
5
|
import SSREntry from "./entry";
|
|
6
6
|
import { time } from "./measure";
|
|
7
7
|
export var render = /*#__PURE__*/function () {
|
|
8
|
-
var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(ctx) {
|
|
9
|
-
var
|
|
10
|
-
App,
|
|
11
|
-
ssrContext,
|
|
12
|
-
_args2 = arguments;
|
|
13
|
-
|
|
8
|
+
var _ref = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2(ctx, config, App) {
|
|
9
|
+
var ssrContext;
|
|
14
10
|
return _regeneratorRuntime().wrap(function _callee2$(_context2) {
|
|
15
11
|
while (1) {
|
|
16
12
|
switch (_context2.prev = _context2.next) {
|
|
17
13
|
case 0:
|
|
18
|
-
_ = _args2.length > 1 && _args2[1] !== undefined ? _args2[1] : process.cwd();
|
|
19
|
-
App = _args2.length > 2 ? _args2[2] : undefined;
|
|
20
14
|
ssrContext = ctx.ssrContext;
|
|
21
15
|
return _context2.abrupt("return", run(ssrContext.request.headers, /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee() {
|
|
22
16
|
var entry, end, html, cost, cacheConfig;
|
|
@@ -26,7 +20,8 @@ export var render = /*#__PURE__*/function () {
|
|
|
26
20
|
case 0:
|
|
27
21
|
entry = new SSREntry({
|
|
28
22
|
ctx: ssrContext,
|
|
29
|
-
App: App
|
|
23
|
+
App: App,
|
|
24
|
+
config: config
|
|
30
25
|
});
|
|
31
26
|
entry.metrics.emitCounter('app.visit.count', 1);
|
|
32
27
|
end = time();
|
|
@@ -54,7 +49,7 @@ export var render = /*#__PURE__*/function () {
|
|
|
54
49
|
}, _callee);
|
|
55
50
|
}))));
|
|
56
51
|
|
|
57
|
-
case
|
|
52
|
+
case 2:
|
|
58
53
|
case "end":
|
|
59
54
|
return _context2.stop();
|
|
60
55
|
}
|
|
@@ -62,7 +57,7 @@ export var render = /*#__PURE__*/function () {
|
|
|
62
57
|
}, _callee2);
|
|
63
58
|
}));
|
|
64
59
|
|
|
65
|
-
return function render(_x) {
|
|
60
|
+
return function render(_x, _x2, _x3) {
|
|
66
61
|
return _ref.apply(this, arguments);
|
|
67
62
|
};
|
|
68
63
|
}();
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import _createForOfIteratorHelper from "@babel/runtime/helpers/esm/createForOfIteratorHelper";
|
|
2
2
|
import path from 'path';
|
|
3
3
|
import { ChunkExtractor } from '@loadable/server';
|
|
4
|
+
import { isCrossOrigin } from "../utils";
|
|
4
5
|
|
|
5
6
|
function getLoadableScripts(extractor) {
|
|
6
7
|
var check = function check(scripts) {
|
|
@@ -21,7 +22,10 @@ function getLoadableScripts(extractor) {
|
|
|
21
22
|
|
|
22
23
|
export var toHtml = function toHtml(jsx, renderer, next) {
|
|
23
24
|
var loadableManifest = renderer.loadableManifest,
|
|
24
|
-
chunksMap = renderer.result.chunksMap
|
|
25
|
+
chunksMap = renderer.result.chunksMap,
|
|
26
|
+
host = renderer.host,
|
|
27
|
+
_renderer$config = renderer.config,
|
|
28
|
+
config = _renderer$config === void 0 ? {} : _renderer$config;
|
|
25
29
|
|
|
26
30
|
if (!loadableManifest || chunksMap.js) {
|
|
27
31
|
return next(jsx);
|
|
@@ -44,7 +48,14 @@ export var toHtml = function toHtml(jsx, renderer, next) {
|
|
|
44
48
|
var fileType = path.extname(v.url).slice(1);
|
|
45
49
|
|
|
46
50
|
if (fileType === 'js') {
|
|
47
|
-
|
|
51
|
+
var props = [];
|
|
52
|
+
var crossorigin = config.crossorigin;
|
|
53
|
+
|
|
54
|
+
if (crossorigin && isCrossOrigin(v.url, host)) {
|
|
55
|
+
props.push("crossorigin=\"".concat(crossorigin === true ? 'anonymous' : crossorigin, "\""));
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
chunksMap[fileType] += "<script src=\"".concat(v.url, "\" ").concat(props.join(' '), "></script>");
|
|
48
59
|
} else if (fileType === 'css') {
|
|
49
60
|
chunksMap[fileType] += "<link href=\"".concat(v.url, "\" rel=\"stylesheet\" />");
|
|
50
61
|
}
|
|
@@ -55,4 +55,13 @@ export var mockResponse = function mockResponse() {
|
|
|
55
55
|
console.info('status can only be used in the server side');
|
|
56
56
|
}
|
|
57
57
|
};
|
|
58
|
+
};
|
|
59
|
+
export var isCrossOrigin = function isCrossOrigin(url, base) {
|
|
60
|
+
if (url.startsWith('/') || url.startsWith('./')) {
|
|
61
|
+
return false;
|
|
62
|
+
} else if (!url.includes(base)) {
|
|
63
|
+
return true;
|
|
64
|
+
} else {
|
|
65
|
+
return false;
|
|
66
|
+
}
|
|
58
67
|
};
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
import type { Plugin } from '../core';
|
|
2
|
-
import { RenderLevel, SSRServerContext } from './serverRender/type';
|
|
2
|
+
import { RenderLevel, SSRPluginConfig, SSRServerContext } from './serverRender/type';
|
|
3
3
|
declare module '../core' {
|
|
4
4
|
interface SSRContainer {
|
|
5
5
|
renderLevel: RenderLevel;
|
|
6
6
|
context?: SSRServerContext;
|
|
7
7
|
}
|
|
8
8
|
}
|
|
9
|
-
declare const ssr: () => Plugin;
|
|
9
|
+
declare const ssr: (_: SSRPluginConfig) => Plugin;
|
|
10
10
|
export default ssr;
|
|
11
11
|
export * from './react';
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import { RuntimeContext } from '../../core';
|
|
2
|
-
import { ModernSSRReactComponent, SSRServerContext, RenderResult } from './type';
|
|
2
|
+
import { ModernSSRReactComponent, SSRServerContext, RenderResult, SSRPluginConfig } from './type';
|
|
3
3
|
declare type EntryOptions = {
|
|
4
4
|
ctx: SSRServerContext;
|
|
5
5
|
App: ModernSSRReactComponent;
|
|
6
|
+
config: SSRPluginConfig;
|
|
6
7
|
};
|
|
7
8
|
export default class Entry {
|
|
8
9
|
entryName: string;
|
|
@@ -11,6 +12,8 @@ export default class Entry {
|
|
|
11
12
|
logger: SSRServerContext['logger'];
|
|
12
13
|
private readonly App;
|
|
13
14
|
private readonly fragments;
|
|
15
|
+
private readonly pluginConfig;
|
|
16
|
+
private readonly host;
|
|
14
17
|
constructor(options: EntryOptions);
|
|
15
18
|
renderToHtml(context: RuntimeContext): Promise<string>;
|
|
16
19
|
private prefetch;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import { RuntimeContext } from '../../core';
|
|
2
|
-
import { ModernSSRReactComponent } from './type';
|
|
3
|
-
export declare const render: (ctx: RuntimeContext,
|
|
2
|
+
import { ModernSSRReactComponent, SSRPluginConfig } from './type';
|
|
3
|
+
export declare const render: (ctx: RuntimeContext, config: SSRPluginConfig, App: ModernSSRReactComponent) => Promise<string>;
|
|
@@ -18,8 +18,10 @@ export declare type ModernSSRReactComponent = React.ComponentType<any> & {
|
|
|
18
18
|
};
|
|
19
19
|
export interface RenderEntry {
|
|
20
20
|
entryName: string;
|
|
21
|
+
host: string;
|
|
21
22
|
result: RenderResult;
|
|
22
23
|
loadableManifest: string | undefined;
|
|
24
|
+
config: SSRPluginConfig;
|
|
23
25
|
}
|
|
24
26
|
export declare type RenderHandler = (jsx: React.ReactElement, renderer: RenderEntry, next: (jsx: React.ReactElement) => string) => string;
|
|
25
27
|
export declare type RenderResult = {
|
|
@@ -29,4 +31,7 @@ export declare type RenderResult = {
|
|
|
29
31
|
js: string;
|
|
30
32
|
css: string;
|
|
31
33
|
};
|
|
34
|
+
};
|
|
35
|
+
export declare type SSRPluginConfig = {
|
|
36
|
+
crossorigin?: boolean | 'anonymous' | 'use-credentials';
|
|
32
37
|
};
|
package/package.json
CHANGED
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
"modern",
|
|
12
12
|
"modern.js"
|
|
13
13
|
],
|
|
14
|
-
"version": "1.
|
|
14
|
+
"version": "1.20.0",
|
|
15
15
|
"jsnext:source": "./src/index.ts",
|
|
16
16
|
"types": "./type.d.ts",
|
|
17
17
|
"main": "./dist/js/node/index.js",
|
|
@@ -140,9 +140,9 @@
|
|
|
140
140
|
"@loadable/babel-plugin": "^5.13.2",
|
|
141
141
|
"@loadable/server": "^5.15.1",
|
|
142
142
|
"@loadable/component": "^5.15.0",
|
|
143
|
-
"@modern-js/plugin": "1.
|
|
144
|
-
"@modern-js/webpack": "1.
|
|
145
|
-
"@modern-js/utils": "1.
|
|
143
|
+
"@modern-js/plugin": "1.20.0",
|
|
144
|
+
"@modern-js/webpack": "1.20.0",
|
|
145
|
+
"@modern-js/utils": "1.20.0",
|
|
146
146
|
"@modern-js-reduck/plugin-auto-actions": "^1.0.2",
|
|
147
147
|
"@modern-js-reduck/plugin-devtools": "^1.0.3",
|
|
148
148
|
"@modern-js-reduck/plugin-effects": "^1.0.2",
|
|
@@ -166,16 +166,16 @@
|
|
|
166
166
|
"ts-jest": "^27.0.4",
|
|
167
167
|
"typescript": "^4",
|
|
168
168
|
"jest": "^27",
|
|
169
|
-
"@modern-js/core": "1.
|
|
170
|
-
"@modern-js/types": "1.
|
|
171
|
-
"@modern-js/utils": "1.
|
|
169
|
+
"@modern-js/core": "1.20.0",
|
|
170
|
+
"@modern-js/types": "1.20.0",
|
|
171
|
+
"@modern-js/utils": "1.20.0",
|
|
172
172
|
"@types/jest": "^27",
|
|
173
173
|
"@types/node": "^14",
|
|
174
174
|
"@types/react-side-effect": "^1.1.1",
|
|
175
175
|
"@types/loadable__webpack-plugin": "^5.7.3",
|
|
176
176
|
"@types/serialize-javascript": "^5.0.1",
|
|
177
|
-
"@scripts/build": "1.
|
|
178
|
-
"@scripts/jest-config": "1.
|
|
177
|
+
"@scripts/build": "1.20.0",
|
|
178
|
+
"@scripts/jest-config": "1.20.0",
|
|
179
179
|
"@testing-library/react": "^12.0.0",
|
|
180
180
|
"@testing-library/react-hooks": "^7.0.1",
|
|
181
181
|
"@types/hoist-non-react-statics": "^3.3.1",
|
|
@@ -215,6 +215,5 @@
|
|
|
215
215
|
"new": "modern new",
|
|
216
216
|
"build": "wireit",
|
|
217
217
|
"test": "wireit"
|
|
218
|
-
}
|
|
219
|
-
"readme": "\n<p align=\"center\">\n <a href=\"https://modernjs.dev\" target=\"blank\"><img src=\"https://lf3-static.bytednsdoc.com/obj/eden-cn/ylaelkeh7nuhfnuhf/modernjs-cover.png\" width=\"300\" alt=\"Modern.js Logo\" /></a>\n</p>\n<p align=\"center\">\n现代 Web 工程体系\n <br/>\n <a href=\"https://modernjs.dev\" target=\"blank\">\n modernjs.dev\n </a>\n</p>\n<p align=\"center\">\n The meta-framework suite designed from scratch for frontend-focused modern web development\n</p>\n\n# Introduction\n\n> The doc site ([modernjs.dev](https://modernjs.dev)) and articles are only available in Chinese for now, we are planning to add English versions soon.\n\n- [Modern.js: Hello, World!](https://zhuanlan.zhihu.com/p/426707646)\n\n## Getting Started\n\n- [Quick Start](https://modernjs.dev/docs/start)\n- [Guides](https://modernjs.dev/docs/guides)\n- [API References](https://modernjs.dev/docs/apis)\n\n## Contributing\n\n- [Contributing Guide](https://github.com/modern-js-dev/modern.js/blob/main/CONTRIBUTING.md)\n"
|
|
218
|
+
}
|
|
220
219
|
}
|