Flutter web: tried to call a non-function, such as null: 'dart.global.myFunction'

Question

I have seen and tried the answers given in the following SO questions :

Question 1

Question 2

Here's what I am doing :

This is my dart code :

@JS()
library t;

import "package:js/js.dart";

@JS("getHomeName")
external String getHostName();

I added this script before the main.dart.js script in the index.html :

  <script>
    function getHostName(){
      return "HOST NAME from javascript" ;
    }
  </script>

And i access this getHostName function from some other dart file like so :

import 'my_js_interface_thing' ; 
print("Got hostname : ${getHostName()}") ;

But I get the following error :

Another exception was thrown: NoSuchMethodError: tried to call a non-function, such as null: 'dart.global.getHomeName'

I presume this has something to do with how I am accessing the getHostName function from dart ? Unfortunately the package:js docs doesn't specify or give any code example regarding using the interface methods from within dart.