@@ -13,44 +13,47 @@ const cssLinksFromAssets = (assets, entrypoint) => {
13
13
) . join ( '' ) : '' : '' ;
14
14
} ;
15
15
16
- const jsScriptTagsFromAssets = ( assets , entrypoint , extra = '' ) => {
16
+ const jsScriptTagsFromAssets = ( assets , entrypoint , ... extra ) => {
17
17
return assets [ entrypoint ] ? assets [ entrypoint ] . js ?
18
18
assets [ entrypoint ] . js . map ( asset =>
19
- `<script src="${ asset } "${ extra } ></script>`
19
+ `<script src="${ asset } " ${ extra . join ( " " ) } ></script>`
20
20
) . join ( '' ) : '' : '' ;
21
21
} ;
22
22
23
+ export const renderApp = ( req , res ) => {
24
+ const context = { } ;
25
+ const markup = renderToString (
26
+ < StaticRouter context = { context } location = { req . url } >
27
+ < App />
28
+ </ StaticRouter >
29
+ ) ;
30
+ const html = `<!doctype html>
31
+ <html lang="">
32
+ <head>
33
+ <meta http-equiv="X-UA-Compatible" content="IE=edge" />
34
+ <meta charset="utf-8" />
35
+ <title>Welcome to Razzle</title>
36
+ <meta name="viewport" content="width=device-width, initial-scale=1">
37
+ ${ cssLinksFromAssets ( assets , 'client' ) }
38
+ </head>
39
+ <body>
40
+ <div id="root">${ markup } </div>
41
+ ${ jsScriptTagsFromAssets ( assets , 'client' , 'defer' , 'crossorigin' ) }
42
+ </body>
43
+ </html>`
44
+ return { context, html} ;
45
+ }
46
+
23
47
const server = express ( ) ;
24
48
server
25
49
. disable ( 'x-powered-by' )
26
50
. use ( express . static ( process . env . RAZZLE_PUBLIC_DIR ) )
27
51
. get ( '/*' , ( req , res ) => {
28
- const context = { } ;
29
- const markup = renderToString (
30
- < StaticRouter context = { context } location = { req . url } >
31
- < App />
32
- </ StaticRouter >
33
- ) ;
34
-
52
+ const { context, html} = renderApp ( req , res ) ;
35
53
if ( context . url ) {
36
54
res . redirect ( context . url ) ;
37
55
} else {
38
- res . status ( 200 ) . send (
39
- `<!doctype html>
40
- <html lang="">
41
- <head>
42
- <meta http-equiv="X-UA-Compatible" content="IE=edge" />
43
- <meta charset="utf-8" />
44
- <title>Welcome to Razzle</title>
45
- <meta name="viewport" content="width=device-width, initial-scale=1">
46
- ${ cssLinksFromAssets ( assets , 'client' ) }
47
- </head>
48
- <body>
49
- <div id="root">${ markup } </div>
50
- ${ jsScriptTagsFromAssets ( assets , 'client' , ' defer crossorigin' ) }
51
- </body>
52
- </html>`
53
- ) ;
56
+ res . status ( 200 ) . send ( html ) ;
54
57
}
55
58
} ) ;
56
59
0 commit comments