dev-toolkit
Version:
Universal Development Toolkit for React Veterans
51 lines (44 loc) • 1.28 kB
JavaScript
import express from 'express';
import path from 'path';
import fs from 'fs';
import React from 'react';
import { renderToString } from 'react-dom/server';
import { isDev } from 'dev-toolkit/settings';
const createHTML = ({ html, script }) => `<!DOCTYPE html>
<html>
<head><title>App</title></head>
<body>
<div data-jshook="app-body">${html}</div>
<script src="${script}"></script>
</body>
</html>`;
export default new class {
constructor() {
this.express = express();
}
start({ assets, buildFolder }) {
if (isDev) {
this.express.use((req, res) =>
res.status(200).send(createHTML({ script: assets.app.js, html: '' }))
);
} else {
this.express.use(express.static(buildFolder));
}
this.serverInstance = this.express.listen(3000);
}
preRender({ assets, buildFolder }) {
return new Promise((resolve, reject) => {
import('src/client/RootComponent').then(module => {
const RootComponent = module.default;
fs.writeFile(
path.join(buildFolder, 'index.html'),
createHTML({
script: assets.app.js,
html: renderToString(<RootComponent />),
}),
error => (error ? reject(error) : resolve())
);
});
});
}
}();