Skip to content

Fix vue3 direct import - #167

Open
Benal78 wants to merge 2 commits into
Shimada666:masterfrom
Benal78:fix-vue3-import
Open

Fix vue3 direct import#167
Benal78 wants to merge 2 commits into
Shimada666:masterfrom
Benal78:fix-vue3-import

Conversation

@Benal78

Copy link
Copy Markdown

While trying to use directly by import the package in a Vue3 app, I was always falling on

ERROR in ./node_modules/v-code-diff/dist/index.es.js 3:0-12
export 'default' (imported as 'On') was not found in 'vue' (possible exports: BaseTransition, BaseTransitionPropsValidators, Comment, DeprecationTypes, EffectScope, ErrorCodes, ErrorTypeStrings, Fragment, KeepAlive, ReactiveEffect, Static, Suspense, Teleport, Text, TrackOpTypes, Transition, TransitionGroup, TriggerOpTypes, VueElement, assertNumber, callWithAsyncErrorHandling, callWithErrorHandling, camelize, capitalize, cloneVNode, compatUtils, computed, createApp, createBlock, createCommentVNode, createElementBlock, createElementVNode, createHydrationRenderer, createPropsRestProxy, createRenderer, createSSRApp, createSlots, createStaticVNode, createTextVNode, createVNode, customRef, defineAsyncComponent, defineComponent, defineCustomElement, defineEmits, defineExpose, defineModel, defineOptions, defineProps, defineSSRCustomElement, defineSlots, devtools, effect, effectScope, getCurrentInstance, getCurrentScope, getCurrentWatcher, getTransitionRawChildren, guardReactiveProps, h, handleError, hasInjectionContext, hydrate, hydrateOnIdle, hydrateOnInteraction, hydrateOnMediaQuery, hydrateOnVisible, initCustomFormatter, initDirectivesForSSR, inject, isMemoSame, isProxy, isReactive, isReadonly, isRef, isRuntimeOnly, isShallow, isVNode, markRaw, mergeDefaults, mergeModels, mergeProps, nextTick, normalizeClass, normalizeProps, normalizeStyle, onActivated, onBeforeMount, onBeforeUnmount, onBeforeUpdate, onDeactivated, onErrorCaptured, onMounted, onRenderTracked, onRenderTriggered, onScopeDispose, onServerPrefetch, onUnmounted, onUpdated, onWatcherCleanup, 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, toValue, transformVNodeArgs, triggerRef, unref, useAttrs, useCssModule, useCssVars, useHost, useId, useModel, useSSRContext, useShadowRoot, useSlots, useTemplateRef, useTransitionState, vModelCheckbox, vModelDynamic, vModelRadio, vModelSelect, vModelText, vShow, version, warn, watch, watchEffect, watchPostEffect, watchSyncEffect, withAsyncContext, withCtx, withDefaults, withDirectives, withKeys, withMemo, withModifiers, withScopeId)
@ ./node_modules/ts-loader/index.js??clonedRuleSet-1.use[0]!./node_modules/vue-loader/dist/index.js??ruleSet[1].rules[13].use[0]!./src/components/Diff.vue?vue&type=script&lang=ts 2:23-44

I noticed the dist directory of the library contained a set of files.
But the root files were exactly the v2.7 based version.

node_modules/v-code-diff/dist$ find . -ls
20266198325056783 0 drwxrwxrwx 1 benal78 benal78 512 Nov 18 15:56 .
9007199256429398 132 -rwxrwxrwx 1 benal78 benal78 134808 Nov 18 15:56 ./index.cjs.js
8725724279718741 184 -rwxrwxrwx 1 benal78 benal78 187253 Nov 18 15:56 ./index.es.js
5066549582682007 0 drwxrwxrwx 1 benal78 benal78 512 Nov 18 15:56 ./v2
6755399443088224 136 -rwxrwxrwx 1 benal78 benal78 136421 Nov 18 15:56 ./v2/index.cjs.js
7318349396509540 188 -rwxrwxrwx 1 benal78 benal78 190642 Nov 18 15:56 ./v2/index.es.js
5910974512956263 136 -rwxrwxrwx 1 benal78 benal78 136548 Nov 18 15:56 ./v2/index.umd.js
5066549582682004 0 drwxrwxrwx 1 benal78 benal78 512 Nov 18 15:56 ./v2.7
7599824373220185 132 -rwxrwxrwx 1 benal78 benal78 134808 Nov 18 15:56 ./v2.7/index.cjs.js
7036874419798872 184 -rwxrwxrwx 1 benal78 benal78 187253 Nov 18 15:56 ./v2.7/index.es.js
8444249303352156 132 -rwxrwxrwx 1 benal78 benal78 134857 Nov 18 15:56 ./v2.7/index.umd.js
5066549582682010 0 drwxrwxrwx 1 benal78 benal78 512 Nov 18 15:56 ./v3
6192449489666909 136 -rwxrwxrwx 1 benal78 benal78 135180 Nov 18 15:56 ./v3/index.cjs.js
7036874419798879 184 -rwxrwxrwx 1 benal78 benal78 187421 Nov 18 15:56 ./v3/index.es.js
9288674233484131 136 -rwxrwxrwx 1 benal78 benal78 135211 Nov 18 15:56 ./v3/index.umd.js

To fix my issue, I had to modify the package.json to allow importing only the v3 version as the patch propose.

@Benal78Benal78 changed the title Fix vue3 importFix vue3 direct importNov 18, 2025
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant

@Benal78