Open JWDobken opened 1 year ago
I can't make the vue-mapbox-gl work with the latest quasar (version == 1.3.2).
vue-mapbox-gl
steps to reproduce
I've create a new project and add choose all default settings:
$ yarn create quasar $ cd quasar-project/ $ yarn add mapbox-gl $ yarn add mapbox-gl-vue
In quasar.config.js I add:
quasar.config.js
const webpack = require('webpack') module.exports = configure(function (ctx) { return { configureWebpack: { plugins: [ new webpack.ProvidePlugin({ mapboxgl: 'mapbox-gl', }), ], }, ...
and replace the content of IndexPage.vue with:
IndexPage.vue
<template> <div id="app"> <mapbox access-token="your access token" :map-options="{ style: 'mapbox://styles/mapbox/light-v9', center: [-96, 37.8], zoom: 3, }" /> </div> </template> <script> import Mapbox from 'mapbox-gl-vue' export default { components: { Mapbox }, } </script> <style> #map { width: 100%; height: 500px; } </style>
That should be it! I run the application locally with quasar dev and it complains that some objects are missing:
quasar dev
App • WARNING • UI in ./node_modules/mapbox-gl-vue/dist/vue-mapbox-gl.esm.js export 'default' (imported as 't') was not found in 'vue' (possible exports: BaseTransition, Comment, EffectScope, Fragment, KeepAlive, ReactiveEffect, Static, Suspense, Teleport, Text, Transition, TransitionGroup, VueElement, callWithAsyncErrorHandling, callWithErrorHandling, camelize, capitalize, cloneVNode, compatUtils, compile, computed, createApp, createBlock, createCommentVNode, createElementBlock, createElementVNode, createHydrationRenderer, createPropsRestProxy, createRenderer, createSSRApp, createSlots, createStaticVNode, createTextVNode, createVNode, customRef, defineAsyncComponent, defineComponent, defineCustomElement, defineEmits, defineExpose, defineProps, defineSSRCustomElement, devtools, effect, effectScope, getCurrentInstance, getCurrentScope, getTransitionRawChildren, guardReactiveProps, h, handleError, hydrate, initCustomFormatter, initDirectivesForSSR, inject, isMemoSame, isProxy, isReactive, isReadonly, isRef, isRuntimeOnly, isShallow, isVNode, markRaw, mergeDefaults, mergeProps, nextTick, normalizeClass, normalizeProps, normalizeStyle, onActivated, onBeforeMount, onBeforeUnmount, onBeforeUpdate, onDeactivated, onErrorCaptured, onMounted, onRenderTracked, onRenderTriggered, onScopeDispose, onServerPrefetch, onUnmounted, onUpdated, openBlock, popScopeId, provide, proxyRefs, pushScopeId, queuePostFlushCb, reactive, readonly, ref, registerRuntimeCompiler, render, renderList, renderSlot, resolveComponent, resolveDirective, resolveDynamicComponent, resolveFilter, resolveTransitionHooks, setBlockTracking, setDevtoolsHook, setTransitionHooks, shallowReactive, shallowReadonly, shallowRef, ssrContextKey, ssrUtils, stop, toDisplayString, toHandlerKey, toHandlers, toRaw, toRef, toRefs, transformVNodeArgs, triggerRef, unref, useAttrs, useCssModule, useCssVars, useSSRContext, useSlots, useTransitionState, vModelCheckbox, vModelDynamic, vModelRadio, vModelSelect, vModelText, vShow, version, warn, watch, watchEffect, watchPostEffect, watchSyncEffect, withAsyncContext, withCtx, withDefaults, withDirectives, withKeys, withMemo, withModifiers, withScopeId) App • WARNING • Compilation succeeded but there are warning(s). Please check the log above. App • Opening default browser at http://localhost:8080
I can't make the
vue-mapbox-gl
work with the latest quasar (version == 1.3.2).steps to reproduce
I've create a new project and add choose all default settings:
In
quasar.config.js
I add:and replace the content of
IndexPage.vue
with:That should be it! I run the application locally with
quasar dev
and it complains that some objects are missing: