title: ReactJS - External JS Function "is not a function"
body: <p>In short, I'm trying to call an external JS function which my 3rd party required me to include, in order to use their API, but doesn't work as it supposed to.</p>
  
  <p>From what I've read, I am supposed to use, for example, <code>window.extFn()</code> after including the external JS in my <code>index.html</code> which contains the <code>extFn()</code> like so</p>
  
  <p><code>&lt;script src="https://example.com/external.js"&gt;&lt;/script&gt;</code> &lt;-- actually not like this, see update 2 as I imported the library locally</p>
  
  <p>...and supposed to use it like how it was answered here: <a href="https://stackoverflow.com/questions/35082047/call-external-javascript-function-from-react-components">Call external Javascript function from react components</a> regardless of whether the said function is inside a file or simply defined on <code>index.html</code> <code>&lt;script&gt;</code> section. This had worked on the JS file I created for testing this.</p>
  
  <pre><code>//File: test.js
  function test() {
      return "Hello";
  }
  </code></pre>
  
  <p>...imported the JS file with <code>script</code> tag like usual, and using <code>console.log(window.test())</code> in my React Component's <code>render()</code> returned <code>Hello</code>.</p>
  
  <p>I tried moving the import to HTML head from body and vice-versa but the error I'm still getting is:</p>
  
  <pre><code>TypeError: window.extFn is not a function
  QuickCheckout.render
  ....
    22 |    }
    23 | 
    24 |    render() {
  &gt; 25 |        window.extFn({
    26 |            
  View compiled
  ▶ 20 stack frames were collapsed.
  </code></pre>
  
  <p>And when I look into my browser console, for some reason I have (which seems to be the key problem)</p>
  
  <p><code>Uncaught SyntaxError: Unexpected token &lt;                                     external.js:1</code></p>
  
  <p>Tried <code>console.log(window.extFn)</code> and it returns <code>undefined</code></p>
  
  <p>So I think it might be possible that the said JS is the problem itself, but I'm at my wit's end with this. Meanwhile I had emailed my 3rd party support team, does anyone have any advice on this? Thank you very much.</p>
  
  <p>UPDATE: Now my <code>test.js</code> file above, which had worked in my experiment, produces the <code>Unexpected token &lt;</code> error as well in my console...</p>
  
  <p>UPDATE 2: I apologize for your problems. But I actually imported the JS from local source due to having to port their library as they had jQuery 2 instead of 3.</p>
  
  <p><code>&lt;script src="assets/js/external.js"&gt;&lt;/script&gt;</code></p>
  
  <p>And to my dumbness, i forgot the trailing <code>/</code>. Thank you for your help.</p>