How to load the google maps api <script> in my react app only when it is required? : <p>I want to try and use the google maps API to show a map but I'm wondering if there's a better way to load the <code>&lt;script&gt;</code> tag than putting it in my index.html.</p>

<p>I would like for the script to load only when I go to the <code>/map</code> route.  So, I would want to remove it from my <code>index.html</code> and load it dynamically.  However, I also want to make sure that if its already been loaded that I don't try and load it again.</p>

<p>I'm not sure if there is a library to handle this.  What I've tried so far (but failed) is to create a <code>loadScript</code> function which appends a <code>&lt;script&gt;</code> to the actual dom and assigns it a key so in this case <code>'google-maps</code>.  </p>

<p>Thanks</p>
