186526/unpkg
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Server render the main page

Browse Source 
Also, add hashes to asset file names and use the "entry manifest" plugin
in dev to get auto-reloading.
This commit is contained in:
Michael Jackson
2019-01-12 19:27:28 -08:00
parent 45c48cba26
commit 09914c1db4
176 changed files with 2725 additions and 119822 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
modules/actions/serveAutoIndexPage.js
View File

@ -2,31 +2,18 @@ import React from 'react';
import ReactDOMServer from 'react-dom/server';
import semver from 'semver';
import MainPage from '../client/MainPage';
import MainTemplate from '../client/MainTemplate';
import AutoIndexApp from '../client/autoIndex/App';
import createHTML from '../client/utils/createHTML';
import renderPage from '../utils/renderPage';
const globalScripts =
process.env.NODE_ENV === 'production'
? [
'/react@16.7.0/umd/react.production.min.js',
'/react-dom@16.7.0/umd/react-dom.production.min.js'
]
: [
'/react@16.7.0/umd/react.development.js',
'/react-dom@16.7.0/umd/react-dom.development.js'
];
import getEntryPoints from '../utils/getEntryPoints';
import renderTemplate from '../utils/renderTemplate';
function byVersion(a, b) {
return semver.lt(a, b) ? -1 : semver.gt(a, b) ? 1 : 0;
}
export default function serveAutoIndexPage(req, res) {
const scripts = globalScripts.concat('/_assets/autoIndex.js');
const styles = ['/autoIndex.css'];
const props = {
const data = {
packageName: req.packageName,
packageVersion: req.packageVersion,
availableVersions: Object.keys(req.packageInfo.versions).sort(byVersion),
@ -34,17 +21,22 @@ export default function serveAutoIndexPage(req, res) {
entry: req.entry,
entries: req.entries
};
const content = createHTML(
ReactDOMServer.renderToString(React.createElement(AutoIndexApp, props))
ReactDOMServer.renderToString(React.createElement(AutoIndexApp, data))
);
const html = renderPage(MainPage, {
const entryPoints = getEntryPoints('autoIndex', {
es: 'module',
system: 'nomodule'
});
const html = renderTemplate(MainTemplate, {
title: `UNPKG - ${req.packageName}`,
description: `The CDN for ${req.packageName}`,
scripts: scripts,
styles: styles,
data: props,
content: content
data,
content,
entryPoints
});
res

32
modules/actions/serveMainPage.js Normal file
View File

@ -0,0 +1,32 @@
import React from 'react';
import ReactDOMServer from 'react-dom/server';
import { StaticRouter } from 'react-router-dom';
import MainTemplate from '../client/MainTemplate';
import MainApp from '../client/main/App';
import createHTML from '../client/utils/createHTML';
import getEntryPoints from '../utils/getEntryPoints';
import renderTemplate from '../utils/renderTemplate';
export default function serveMainPage(req, res) {
const element = React.createElement(
StaticRouter,
{ location: req.url },
React.createElement(MainApp)
);
const content = createHTML(ReactDOMServer.renderToString(element));
const entryPoints = getEntryPoints('main', {
es: 'module',
system: 'nomodule'
});
const html = renderTemplate(MainTemplate, { content, entryPoints });
res
.set({
'Cache-Control': 'public, max-age=14400', // 4 hours
'Cache-Tag': 'main'
})
.send(html);
}