Mapbox-gl в однофайловом компоненте Vue.js (Quasar-Framework)

Я хотел бы реализовать карту Mapbox-gl-js в однофайловом компоненте Quasar Framework (Vue), но у меня это не работает. Я нашел кое-какой код на Googlemaps с Vue и кое-что на Mapbox с React и попытался собрать его воедино. С приведенными ниже параметрами инициализации карты я могу получить карту, отображаемую в index.html (с плитками mapzen), но хочу, чтобы она была в компоненте.

Я стараюсь следовать этому [https://laracasts.com/discuss/channels/vue/google-maps-and-vue-js](ссылка), а затем настройте его для Mapbox: proj/src/components/maplayout.vue :

<template>
    <quasar-layout>
      <h3>Map</h3>
      <div id='map'></div>
    </quasar-layout>
  </template>

  <script>
  import mapboxgl from '../app'

  export default {
    data () {
      return {}
    },
    create () {
      this.createMap()
    },
    methods: {
      createMap: function () {
        mapboxgl.accessToken = '{{yourmapboxaccestokenkey}}'
        var simple = {
          'version': 8,
          'sources': {
            'osm': {
              'type': 'vector',
              'tiles': ['https://vector.mapzen.com/osm/all/{z}/{x}/{y}.mvt?api_key=vector-tiles-{{yourmapzenapikey}}']
            }
          },
          'layers': [{
            'id': 'background',
            'type': 'background',
            'paint': {
              'background-color': '#adddd2'
            }
          }, {
            'id': 'majorroad',
            'source': 'osm',
            'source-layer': 'roads',
            'type': 'line'
          }, {
            'id': 'buildings',
            'type': 'fill',
            'source': 'osm',
            'source-layer': 'buildings'
          }]
        }

        // initialize the map
        this.map = new mapboxgl.Map({
          container: 'map',
          style: simple,
          center: [-1.83, -78.183],
          zoom: 5.5
        })
      }
    }
  }
  </script>

  <style>
  </style>

Кстати, для mapbox с webpack нужны определенные загрузчики, см.: [https://mikewilliamson.wordpress.com/2016/02/24/using-mapbox-gl-and-webpack-together/](ссылка url) Но как я понял Mapbox работал с Webpack раньше (без vue), думаю, у меня все в порядке, на самом деле я не получаю никаких ошибок в консоли браузера (но, очевидно, карта не появляется).

В файле app.js я не знаю, как быть с предложенным (может быть, это и не нужно, так как googlemaps нужен обратный вызов, не знаю насчёт mapbox/mapzen?!):

var App = window.App = new Vue ({
//code
})

Как и в Квазаре инициализация делается так:

Quasar.start(() => {
  Router.start(Vue.extend({}), '#quasar-app')
})

Чего я совсем не понимаю...

Любые предложения, как заставить это работать, приветствуются!