Windows 10 reached EOS (end of support) on October 14, 2025. If you are on Windows 10, see this article.

Avatar for Username

Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

Template literal not resolving as expected

  • No replies
  • 0 have this problem
  • 35 views
  • Open
gggustafson
gggustafson

I have a directory structure

C: 

   Gustafson
       Website
           ⋮
           scripts
               global.js
               ⋮
           ⋮
           TestDirectory
               baseUrl_test.html
           ⋮

In the <head> of a webpage, I determine a baseUrl for the page using the following: 

 <script>
   // assumes website topmost directory is "Website""
   ( async ( ) => {
     const segments = document.documentURI.split ( "/");
     const index = segments.findIndex ( element => 
                                        element == "Website" );
     if ( index < 0 )
       {
       throw new TypeError ( 
                 "Website structure not constructed correctly" );
       }
     segments.length = index + 1;
     let path = segments.join ( "/" );
     path += "/";
     window.baseUrl = path;
     console.log(`${baseUrl}`);
     } ) ( );
 </script>

The console log displays

file:///C:/Gustafson/Website/

In the body is 

 <script>
   console.log ( `${baseUrl}scripts/global.js` );
 </script>
 <script src=`${baseUrl}scripts/global.js`></script>
 <script>
 window.onload = 
   function ( )
     {
     Global.initialize_globals ( );
     };
 </script>

The console log displays

file:///C:/Gustafson/Website/scripts/global.js Loading failed for the <script> with source “file:///C:/Gustafson/Website/TestDirectory/%60$%7BbaseUrl%7Dscripts/global.js%60”. Uncaught ReferenceError: Global is not defined 

   onload file:///C:/Gustafson/Website/TestDirectory/baseUrl_test.html:37
   EventHandlerNonNull* file:///C:/Gustafson/Website/TestDirectory/baseUrl_test.html:34

The problem is the console.log displays what is expected but the src= is using something totally different.

I have a directory structure C: Gustafson Website ⋮ scripts global.js ⋮ ⋮ TestDirectory baseUrl_test.html ⋮ In the <head> of a webpage, I determine a baseUrl for the page using the following: <script> // assumes website topmost directory is "Website"" ( async ( ) => { const segments = document.documentURI.split ( "/"); const index = segments.findIndex ( element => element == "Website" ); if ( index < 0 ) { throw new TypeError ( "Website structure not constructed correctly" ); } segments.length = index + 1; let path = segments.join ( "/" ); path += "/"; window.baseUrl = path; console.log(`${baseUrl}`); } ) ( ); </script> The console log displays file:///C:/Gustafson/Website/ In the body is <script> console.log ( `${baseUrl}scripts/global.js` ); </script> <script src=`${baseUrl}scripts/global.js`></script> <script> window.onload = function ( ) { Global.initialize_globals ( ); }; </script> The console log displays file:///C:/Gustafson/Website/scripts/global.js Loading failed for the <script> with source “file:///C:/Gustafson/Website/TestDirectory/%60$%7BbaseUrl%7Dscripts/global.js%60”. Uncaught ReferenceError: Global is not defined onload file:///C:/Gustafson/Website/TestDirectory/baseUrl_test.html:37 EventHandlerNonNull* file:///C:/Gustafson/Website/TestDirectory/baseUrl_test.html:34 The problem is the console.log displays what is expected but the src= is using something totally different.

You must log in to your account to reply to posts. Please start a new question, if you do not have an account yet.