title: External libraries work just fine in a .html file but not in a quasar project
body: <p>I'm trying to move my code in an .html file to a Quasar project. The code works perfectly fine when I run my .html file but I receive errors from Quasar.
  Here is my initial code in the index.html file:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
  &lt;head&gt;
      &lt;meta charset="UTF-8"&gt;
      &lt;title&gt;Neshan Map Example (Leaflet)&lt;/title&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"&gt;
  
      &lt;link href="https://static.neshan.org/sdk/leaflet/1.4.0/leaflet.css" rel="stylesheet" type="text/css"&gt;
      &lt;script src="https://static.neshan.org/sdk/leaflet/1.4.0/leaflet.js" type="text/javascript"&gt;&lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;div id="map" style="width: 600px; height: 450px; background: #eee; border: 2px solid #aaa;"&gt;&lt;/div&gt;
  
  &lt;script type="text/javascript"&gt;
      var myMap = new L.Map('map', {
          key: 'myKey',
          maptype: 'dreamy',
          poi: true,
          traffic: false,
          center: [36.320378,59.571256],
          zoom: 14
      });
      L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png?{foo}', {foo: 'bar', attribution: 'Map data &amp;copy; &lt;a href="https://www.openstreetmap.org/"&gt;OpenStreetMap&lt;/a&gt; contributors, &lt;a href="https://creativecommons.org/licenses/by-sa/2.0/"&gt;CC-BY-SA&lt;/a&gt;'}).addTo(myMap);
      var marker = L.marker([36.320378,59.571256]).addTo(myMap);
      var popup = marker.bindPopup('&lt;b&gt;Hello world!&lt;/b&gt;&lt;br /&gt;I am a popup.');
      popup.openPopup();
  &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>The below code is my index.vue:</p>
  
  <pre><code>&lt;template&gt;
    &lt;q-page class="flex flex-center"&gt;
      &lt;link href="https://static.neshan.org/sdk/leaflet/1.4.0/leaflet.css" rel="stylesheet" type="text/css"&gt;
      &lt;script src="https://static.neshan.org/sdk/leaflet/1.4.0/leaflet.js" type="text/javascript"&gt;&lt;/script&gt;
      &lt;div id="map" style="width: 600px; height: 450px; background: #eee; border: 2px solid #aaa;"&gt;&gt;&lt;/div&gt;
    &lt;/q-page&gt;
  &lt;/template&gt;
  
  &lt;script type="text/javascript"&gt;
      var myMap = new L.Map('map', {
          key: 'myKey',
          maptype: 'dreamy',
          poi: true,
          traffic: false,
          center: [36.320378,59.571256],
          zoom: 14
      });
      L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png?{foo}', {foo: 'bar', attribution: 'Map data &amp;copy; &lt;a href="https://www.openstreetmap.org/"&gt;OpenStreetMap&lt;/a&gt; contributors, &lt;a href="https://creativecommons.org/licenses/by-sa/2.0/"&gt;CC-BY-SA&lt;/a&gt;'}).addTo(myMap);
      var marker = L.marker([36.320378,59.571256]).addTo(myMap);
      var popup = marker.bindPopup('&lt;b&gt;Hello world!&lt;/b&gt;&lt;br /&gt;I am a popup.');
      popup.openPopup();
  &lt;/script&gt;
  </code></pre>
  
  <p>I received this error from the browser: </p>
  
  <blockquote>
    <p>Templates should only be responsible for mapping the state to the UI. Avoid placing tags with side-effects in your templates, such as <code>&lt;script&gt;</code>, as they will not be parsed</p>
  </blockquote>
  
  <p>I also tried this:</p>
  
  <pre><code>&lt;template&gt;
    &lt;q-page class="flex flex-center"&gt;
      &lt;link href="https://static.neshan.org/sdk/leaflet/1.4.0/leaflet.css" rel="stylesheet" type="text/css"&gt;
      &lt;div id="map" style="width: 600px; height: 450px; background: #eee; border: 2px solid #aaa;"&gt;&gt;&lt;/div&gt;
    &lt;/q-page&gt;
  &lt;/template&gt;
  
  &lt;script type="text/javascript"&gt;
      import * as Vue2Leaflet from 'vue2-leaflet'
      var myMap = new L.Map('map', {
          key: 'myKey',
          maptype: 'dreamy',
          poi: true,
          traffic: false,
          center: [36.320378,59.571256],
          zoom: 14
      });
      L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png?{foo}', {foo: 'bar', attribution: 'Map data &amp;copy; &lt;a href="https://www.openstreetmap.org/"&gt;OpenStreetMap&lt;/a&gt; contributors, &lt;a href="https://creativecommons.org/licenses/by-sa/2.0/"&gt;CC-BY-SA&lt;/a&gt;'}).addTo(myMap);
      var marker = L.marker([36.320378,59.571256]).addTo(myMap);
      var popup = marker.bindPopup('&lt;b&gt;Hello world!&lt;/b&gt;&lt;br /&gt;I am a popup.');
      popup.openPopup();
  &lt;/script&gt;
  </code></pre>
  
  <p>Even though I don't get any error from the code above, the map does not appear in the browser. What am I doing wrong?</p>