@@ -6,19 +6,28 @@ import serialize from 'serialize-javascript';
66
77// Match main.asdf123.js in production mode or bundle.js in dev mode 
88const  mainBundleRegex  =  / ( m a i n | b u n d l e ) \. (?: .* \. ) ? j s $ / ; 
9+ const  bootstrapBundleRegex  =  / ( b o o t s t r a p ) \. (?: .* \. ) ? j s $ / ; 
910
1011let  bundles ; 
1112try  { 
12-   bundles  =  fs . readdirSync ( path . join ( __dirname ,  '../../build/static/js' ) ) ; 
13+   bundles  =  fs . readdirSync ( 
14+     process . env . NODE_ENV  ===  'production' 
15+       ? './build/static/js' 
16+       : path . join ( __dirname ,  '../../build/static/js' ) 
17+   ) ; 
1318}  catch  ( err )  { 
19+   console . error ( err ) ; 
1420  throw  new  Error ( 
1521    'It looks like you didn\'t run "yarn run dev:web" or "yarn run build:web" before starting hyperion. Please wait until either of them completes before starting hyperion.' 
1622  ) ; 
1723} 
1824
1925// Get the main bundle filename 
2026const  mainBundle  =  bundles . find ( bundle  =>  mainBundleRegex . test ( bundle ) ) ; 
21- if  ( ! mainBundle )  { 
27+ const  bootstrapBundle  =  bundles . find ( bundle  => 
28+   bootstrapBundleRegex . test ( bundle ) 
29+ ) ; 
30+ if  ( ! mainBundle  ||  ! bootstrapBundle )  { 
2231  throw  new  Error ( 
2332    'It looks like you didn\'t run "yarn run dev:web" or "yarn run build:web" before starting hyperion. Please wait until either of them completes before starting hyperion.' 
2433  ) ; 
@@ -34,54 +43,55 @@ export const getHeader = ({
3443  metaTags : string , 
3544  nonce : string , 
3645} )  =>  { 
46+   // prettier-ignore 
3747  return  html ` 
38-        <!DOCTYPE html>   
39-        < html  lang ="en ">  
40-          < head >  
41-            < meta  charset ="utf-8 ">  
42-            < meta  name ="viewport " content ="width=device-width,initial-scale=1 ">  
43-            < link  rel ="mask-icon " href ="/img/pinned-tab.svg " color ="#171A21 ">  
44-            < meta  name ="theme-color " content ="#171A21 ">  
45-            < link  rel ="manifest " href ="/manifest.json ">  
46-            < meta  property ="og:site_name " content ="Spectrum ">  
47-            < meta  name ="twitter:card " content ="summary ">  
48-            < meta  name ="twitter:site " content ="@withspectrum ">  
49-            < meta  name ="twitter:image:alt " content ="Where communities are built ">  
50-            < link  rel ="apple-touch-icon-precomposed " sizes ="57x57 " href ="/img/apple-icon-57x57-precomposed.png " />  
51-            < link  rel ="apple-touch-icon-precomposed " sizes ="72x72 " href ="/img/apple-icon-72x72-precomposed.png " />  
52-            < link  rel ="apple-touch-icon-precomposed " sizes ="114x114 " href ="/img/apple-icon-114x114-precomposed.png " />  
53-            < link  rel ="apple-touch-icon-precomposed " sizes ="144x144 " href ="/img/apple-icon-144x144-precomposed.png " />  
54-            ${ metaTags }  
55-            < script  type ="text/javascript " nonce ="${ nonce }  ">  
56-                ! function ( e , a , t , n , g , c , o ) { e . GoogleAnalyticsObject = g , e . ga = e . ga || function ( ) { ( e . ga . q = e . ga . q || [ ] ) . push ( arguments ) } , e . ga . l = 1 * new  Date , c = a . createElement ( t ) , o = a . getElementsByTagName ( t ) [ 0 ] , c . defer = 1 , c . src = "https://www.google-analytics.com/analytics.js" , o . parentNode . insertBefore ( c , o ) } ( window , document , "script" , 0 , "ga" ) , ga ( "create" , "UA-92673909-1" , "auto" ) , ga ( "send" , "pageview" ) , ga ( 'set' ,  'anonymizeIp' ,  true )  
57-            </ script >  
58-            < script  nonce ="${ nonce }  " type ="text/javascript ">  
59-              ( function ( e , t ) { var  n = e . amplitude || { _q :[ ] , _iq :{ } } ; var  r = t . createElement ( "script" )  
60-              ; r . type = "text/javascript" ; r . async = true  
61-              ; r . src = "https://cdn.amplitude.com/libs/amplitude-4.2.1-min.gz.js"  
62-              ; r . onload = function ( ) { if ( e . amplitude . runQueuedFunctions ) {  
63-              e . amplitude . runQueuedFunctions ( ) } else {  
64-              console . error ( "[Amplitude] Error: could not load SDK" ) } }  
65-              ; var  i = t . getElementsByTagName ( "script" ) [ 0 ] ; i . parentNode . insertBefore ( r , i )  
66-              ; function  s ( e , t ) { e . prototype [ t ] = function ( ) {  
67-              this . _q . push ( [ t ] . concat ( Array . prototype . slice . call ( arguments , 0 ) ) ) ; return  this } }  
68-              var  o = function ( ) { this . _q = [ ] ; return  this }  
69-              ; var  a = [ "add" , "append" , "clearAll" , "prepend" , "set" , "setOnce" , "unset" ]  
70-              ; for ( var  u = 0 ; u < a . length ; u ++ ) { s ( o , a [ u ] ) } n . Identify = o ; var  c = function ( ) { this . _q = [ ]  
71-              ; return  this }  
72-              ; var  l = [ "setProductId" , "setQuantity" , "setPrice" , "setRevenueType" , "setEventProperties" ]  
73-              ; for ( var  p = 0 ; p < l . length ; p ++ ) { s ( c , l [ p ] ) } n . Revenue = c  
74-              ; var  d = [ "init" , "logEvent" , "logRevenue" , "setUserId" , "setUserProperties" , "setOptOut" , "setVersionName" , "setDomain" , "setDeviceId" , "setGlobalUserProperties" , "identify" , "clearUserProperties" , "setGroup" , "logRevenueV2" , "regenerateDeviceId" , "logEventWithTimestamp" , "logEventWithGroups" , "setSessionId" , "resetSessionId" ]  
75-              ; function  v ( e ) { function  t ( t ) { e [ t ] = function ( ) {  
76-              e . _q . push ( [ t ] . concat ( Array . prototype . slice . call ( arguments , 0 ) ) ) } }  
77-              for ( var  n = 0 ; n < d . length ; n ++ ) { t ( d [ n ] ) } } v ( n ) ; n . getInstance = function ( e ) {  
78-              e = ( ! e || e . length === 0 ?"$default_instance" :e ) . toLowerCase ( )  
79-              ; if ( ! n . _iq . hasOwnProperty ( e ) ) { n . _iq [ e ] = { _q :[ ] } ; v ( n . _iq [ e ] ) } return  n . _iq [ e ] }  
80-              ; e . amplitude = n } ) ( window , document ) ;  
81-            </ script >  
82-          </ head >  
83-          < body >  
84-            < div  id ="root "> ` ; 
48+     <!DOCTYPE html>   
49+     < html  lang ="en ">  
50+       < head >  
51+         < meta  charset ="utf-8 ">  
52+         < meta  name ="viewport " content ="width=device-width,initial-scale=1 ">  
53+         < link  rel ="mask-icon " href ="/img/pinned-tab.svg " color ="#171A21 ">  
54+         < meta  name ="theme-color " content ="#171A21 ">  
55+         < link  rel ="manifest " href ="/manifest.json ">  
56+         < meta  property ="og:site_name " content ="Spectrum ">  
57+         < meta  name ="twitter:card " content ="summary ">  
58+         < meta  name ="twitter:site " content ="@withspectrum ">  
59+         < meta  name ="twitter:image:alt " content ="Where communities are built ">  
60+         < link  rel ="apple-touch-icon-precomposed " sizes ="57x57 " href ="/img/apple-icon-57x57-precomposed.png " />  
61+         < link  rel ="apple-touch-icon-precomposed " sizes ="72x72 " href ="/img/apple-icon-72x72-precomposed.png " />  
62+         < link  rel ="apple-touch-icon-precomposed " sizes ="114x114 " href ="/img/apple-icon-114x114-precomposed.png " />  
63+         < link  rel ="apple-touch-icon-precomposed " sizes ="144x144 " href ="/img/apple-icon-144x144-precomposed.png " />  
64+         ${ metaTags }  
65+         < script  type ="text/javascript " nonce ="${ nonce }  ">  
66+             ! function ( e , a , t , n , g , c , o ) { e . GoogleAnalyticsObject = g , e . ga = e . ga || function ( ) { ( e . ga . q = e . ga . q || [ ] ) . push ( arguments ) } , e . ga . l = 1 * new  Date , c = a . createElement ( t ) , o = a . getElementsByTagName ( t ) [ 0 ] , c . defer = 1 , c . src = "https://www.google-analytics.com/analytics.js" , o . parentNode . insertBefore ( c , o ) } ( window , document , "script" , 0 , "ga" ) , ga ( "create" , "UA-92673909-1" , "auto" ) , ga ( "send" , "pageview" ) , ga ( 'set' ,  'anonymizeIp' ,  true )  
67+         </ script >  
68+         < script  nonce ="${ nonce }  " type ="text/javascript ">  
69+           ( function ( e , t ) { var  n = e . amplitude || { _q :[ ] , _iq :{ } } ; var  r = t . createElement ( "script" )  
70+           ; r . type = "text/javascript" ; r . async = true  
71+           ; r . src = "https://cdn.amplitude.com/libs/amplitude-4.2.1-min.gz.js"  
72+           ; r . onload = function ( ) { if ( e . amplitude . runQueuedFunctions ) {  
73+           e . amplitude . runQueuedFunctions ( ) } else {  
74+           console . error ( "[Amplitude] Error: could not load SDK" ) } }  
75+           ; var  i = t . getElementsByTagName ( "script" ) [ 0 ] ; i . parentNode . insertBefore ( r , i )  
76+           ; function  s ( e , t ) { e . prototype [ t ] = function ( ) {  
77+           this . _q . push ( [ t ] . concat ( Array . prototype . slice . call ( arguments , 0 ) ) ) ; return  this } }  
78+           var  o = function ( ) { this . _q = [ ] ; return  this }  
79+           ; var  a = [ "add" , "append" , "clearAll" , "prepend" , "set" , "setOnce" , "unset" ]  
80+           ; for ( var  u = 0 ; u < a . length ; u ++ ) { s ( o , a [ u ] ) } n . Identify = o ; var  c = function ( ) { this . _q = [ ]  
81+           ; return  this }  
82+           ; var  l = [ "setProductId" , "setQuantity" , "setPrice" , "setRevenueType" , "setEventProperties" ]  
83+           ; for ( var  p = 0 ; p < l . length ; p ++ ) { s ( c , l [ p ] ) } n . Revenue = c  
84+           ; var  d = [ "init" , "logEvent" , "logRevenue" , "setUserId" , "setUserProperties" , "setOptOut" , "setVersionName" , "setDomain" , "setDeviceId" , "setGlobalUserProperties" , "identify" , "clearUserProperties" , "setGroup" , "logRevenueV2" , "regenerateDeviceId" , "logEventWithTimestamp" , "logEventWithGroups" , "setSessionId" , "resetSessionId" ]  
85+           ; function  v ( e ) { function  t ( t ) { e [ t ] = function ( ) {  
86+           e . _q . push ( [ t ] . concat ( Array . prototype . slice . call ( arguments , 0 ) ) ) } }  
87+           for ( var  n = 0 ; n < d . length ; n ++ ) { t ( d [ n ] ) } } v ( n ) ; n . getInstance = function ( e ) {  
88+           e = ( ! e || e . length === 0 ?"$default_instance" :e ) . toLowerCase ( )  
89+           ; if ( ! n . _iq . hasOwnProperty ( e ) ) { n . _iq [ e ] = { _q :[ ] } ; v ( n . _iq [ e ] ) } return  n . _iq [ e ] }  
90+           ; e . amplitude = n } ) ( window , document ) ;  
91+         </ script >  
92+       </ head >  
93+       < body >  
94+         < div  id ="root "> ` ; 
8595} ; 
8696
8797export  const  getFooter  =  ( { 
@@ -103,7 +113,7 @@ export const getFooter = ({
103113  ) }  </script>
104114      <script nonce="${ nonce }  ">window.__DATA__=${ serialize ( data ) }  </script> 
105115      <script defer="defer" type="text/javascript" src="https://cdn.polyfill.io/v2/polyfill.min.js?features=default,Array.prototype.find,Symbol.iterator"></script> 
106-       <script type="text/javascript"  src=" /static/js/bootstrap.js"></script>  
116+       ${ createScriptTag ( {   src :  ` /static/js/${ bootstrapBundle } `   } ) }  
107117      ${ bundles . map ( src  =>  createScriptTag ( {  src } ) ) }  
108118      ${ createScriptTag ( {  src : `/static/js/${ mainBundle }  `  } ) }  
109119    </body> 
0 commit comments