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

Use special type for HTML

This commit is contained in:
Michael Jackson 2018-07-31 15:34:34 -07:00
parent 4605425fd8
commit 7e85e1de5b
4 changed files with 14 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
modules/actions/serveAutoIndexPage.js
View File

@ -4,6 +4,7 @@ const semver = require("semver");
const MainPage = require("../client/MainPage"); const MainPage = require("../client/MainPage");
const AutoIndexApp = require("../client/autoIndex/App"); const AutoIndexApp = require("../client/autoIndex/App");
const createHTML = require("../client/utils/createHTML");
const renderPage = require("../utils/renderPage"); const renderPage = require("../utils/renderPage");
const globalScripts = const globalScripts =
@ -33,8 +34,8 @@ function serveAutoIndexPage(req, res) {
entry: req.entry, entry: req.entry,
entries: req.entries entries: req.entries
}; };
const content = ReactDOMServer.renderToString( const content = createHTML(
React.createElement(AutoIndexApp, props) ReactDOMServer.renderToString(React.createElement(AutoIndexApp, props))
); );
const html = renderPage(MainPage, { const html = renderPage(MainPage, {

4
modules/actions/serveMainPage.js → modules/actions/serveRootPage.js
View File

@ -14,7 +14,7 @@ const globalScripts =
"/react-router-dom@4.3.1/umd/react-router-dom.js" "/react-router-dom@4.3.1/umd/react-router-dom.js"
]; ];
function serveMainPage(req, res) { function serveRootPage(req, res) {
const scripts = globalScripts.concat(req.assets.getScripts("main")); const scripts = globalScripts.concat(req.assets.getScripts("main"));
const styles = req.assets.getStyles("main"); const styles = req.assets.getStyles("main");
@ -26,4 +26,4 @@ function serveMainPage(req, res) {
res.send(html); res.send(html);
} }
module.exports = serveMainPage; module.exports = serveRootPage;

12
modules/client/MainPage.js
View File

@ -1,7 +1,7 @@
const React = require("react"); const React = require("react");
const PropTypes = require("prop-types"); const PropTypes = require("prop-types");
const h = require("./utils/createHTML"); const createHTML = require("./utils/createHTML");
const x = require("./utils/execScript"); const x = require("./utils/execScript");
function MainPage({ title, description, scripts, styles, data, content }) { function MainPage({ title, description, scripts, styles, data, content }) {
@ -28,20 +28,24 @@ function MainPage({ title, description, scripts, styles, data, content }) {
<title>{title}</title> <title>{title}</title>
</head> </head>
<body> <body>
<div id="root" dangerouslySetInnerHTML={h(content)} /> <div id="root" dangerouslySetInnerHTML={content} />
{scripts.map(s => <script key={s} src={s} />)} {scripts.map(s => <script key={s} src={s} />)}
</body> </body>
</html> </html>
); );
} }
const htmlType = PropTypes.shape({
__html: PropTypes.string
});
MainPage.propTypes = { MainPage.propTypes = {
title: PropTypes.string, title: PropTypes.string,
description: PropTypes.string, description: PropTypes.string,
scripts: PropTypes.arrayOf(PropTypes.string), scripts: PropTypes.arrayOf(PropTypes.string),
styles: PropTypes.arrayOf(PropTypes.string), styles: PropTypes.arrayOf(PropTypes.string),
data: PropTypes.any, data: PropTypes.any,
content: PropTypes.string content: htmlType
}; };
MainPage.defaultProps = { MainPage.defaultProps = {
@ -50,7 +54,7 @@ MainPage.defaultProps = {
scripts: [], scripts: [],
styles: [], styles: [],
data: {}, data: {},
content: "" content: createHTML("")
}; };
module.exports = MainPage; module.exports = MainPage;

2
modules/createRouter.js
View File

@ -11,7 +11,7 @@ function route(setup) {
function createRouter() { function createRouter() {
const app = express.Router(); const app = express.Router();
app.get("/", require("./actions/serveMainPage")); app.get("/", require("./actions/serveRootPage"));
app.use(cors()); app.use(cors());
app.use(bodyParser.json()); app.use(bodyParser.json());