Hi,
We want to trial the GanttChart Vue component in our Vue3 application, however our build is failing with the following warning:
WARNING in ./node_modules/@syncfusion/ej2-vue-base/src/template.js 122:39-49
export 'extend' (imported as 'Vue') 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)
This is our package.json - we're using up-to-date versions of Vue / SyncFusion / VueClassComponent;
{
"private": true,
"scripts": {
"dev": "npm run development",
"development": "mix",
"watch": "mix watch",
"watch-poll": "mix watch -- --watch-options-poll=1000",
"hot": "mix watch --hot",
"prod": "npm run production",
"production": "mix --production"
},
"devDependencies": {
"@babel/plugin-syntax-dynamic-import": "^7.8.3",
"@headlessui/vue": "^1.5.0",
"@heroicons/vue": "^1.0.5",
"@inertiajs/inertia": "^0.11.0",
"@inertiajs/inertia-vue3": "^0.6.0",
"@inertiajs/progress": "^0.2.7",
"@syncfusion/ej2-vue-gantt": "^20.1.51",
"@tailwindcss/forms": "^0.4.0",
"@vueform/slider": "^2.0.9",
"axios": "^0.26.0",
"del": "^6.0.0",
"dropzone": "^6.0.0-beta.2",
"highcharts": "^9.3.3",
"highcharts-vue": "^1.4.0",
"laravel-mix": "^6.0.41",
"laravel-mix-bundle-analyzer": "^1.0.5",
"postcss": "^8.4.5",
"postcss-import": "^14.0.2",
"tailwindcss": "^3.0.17",
"vanillajs-datepicker": "^1.2.0",
"vue": "^3.0.11",
"vue-class-component": "^8.0.0-rc.1",
"vue-debounce": "^3.0.2",
"vue-loader": "^16.8.3",
"webpack-bundle-analyzer": "^4.5.0"
}
}
We've searched online and can't find a solution - any help you can give is appreciated.
Attachment:
Screenshot_20220427_at_15.42.19.png_de8d7f2.zip
