Merge pull request #1685 from heinthanth/cra-server-patches

fivethreeo · web-flow · commit f3d5266883d6 · 2021-08-14T14:03:22.000+02:00
add missing renderApp in template
diff --git a/packages/create-razzle-app/templates/default/src/server.js b/packages/create-razzle-app/templates/default/src/server.js
@@ -13,44 +13,47 @@ const cssLinksFromAssets = (assets, entrypoint) => {
   ).join('') : '' : '';
 };
 
-const jsScriptTagsFromAssets = (assets, entrypoint, extra = '') => {
+const jsScriptTagsFromAssets = (assets, entrypoint, ...extra) => {
   return assets[entrypoint] ? assets[entrypoint].js ?
   assets[entrypoint].js.map(asset=>
-    `<script src="${asset}"${extra}></script>`
+    `<script src="${asset}" ${extra.join(" ")}></script>`
   ).join('') : '' : '';
 };
 
+export const renderApp = (req, res) => {
+  const context = {};
+  const markup = renderToString(
+    <StaticRouter context={context} location={req.url}>
+      <App />
+    </StaticRouter>
+  );
+  const html = `<!doctype html>
+  <html lang="">
+  <head>
+      <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+      <meta charset="utf-8" />
+      <title>Welcome to Razzle</title>
+      <meta name="viewport" content="width=device-width, initial-scale=1">
+      ${cssLinksFromAssets(assets, 'client')}
+  </head>
+  <body>
+      <div id="root">${markup}</div>
+      ${jsScriptTagsFromAssets(assets, 'client', 'defer', 'crossorigin')}
+  </body>
+</html>`
+  return {context, html};
+}
+
 const server = express();
 server
   .disable('x-powered-by')
   .use(express.static(process.env.RAZZLE_PUBLIC_DIR))
   .get('/*', (req, res) => {
-    const context = {};
-    const markup = renderToString(
-      <StaticRouter context={context} location={req.url}>
-        <App />
-      </StaticRouter>
-    );
-
+    const {context, html} = renderApp(req, res);
     if (context.url) {
       res.redirect(context.url);
     } else {
-      res.status(200).send(
-        `<!doctype html>
-    <html lang="">
-    <head>
-        <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-        <meta charset="utf-8" />
-        <title>Welcome to Razzle</title>
-        <meta name="viewport" content="width=device-width, initial-scale=1">
-        ${cssLinksFromAssets(assets, 'client')}
-    </head>
-    <body>
-        <div id="root">${markup}</div>
-        ${jsScriptTagsFromAssets(assets, 'client', ' defer crossorigin')}
-    </body>
-</html>`
-      );
+      res.status(200).send(html);
     }
   });
 
