nonzzz / vite-plugin-cdn

replace module with CDN. work with vite.
MIT License
73 stars 5 forks source link

引入报错 #36

Closed txw2018 closed 6 months ago

txw2018 commented 6 months ago

index-bae519ee.js:1 Uncaught TypeError: Cannot read properties of undefined (reading 'BaseTransition') at index-bae519ee.js:1:1435305 image

txw2018 commented 6 months ago

![Uploading image.png…]()

nonzzz commented 6 months ago

详细信息呢?比如配置 以及版本

edisonyan commented 6 months ago

遇到类似问题, 使用的是1.0.0版本 image

cdn({ modules: [ 'vue', 'vue-router', 'vue-demi', 'pinia', 'axios', 'element-plus', '@element-plus/icons-vue', 'echarts', 'json-schema-faker' ], apply: command })

nonzzz commented 6 months ago

👌我等会看看

nonzzz commented 6 months ago

@edisonyan 能提供一份package.json吗 我想看看demi的版本

nonzzz commented 6 months ago

根据错误日志我能做的猜测比如vue-demi的cdn加载失败(network)BaseTransition的话我得看看

edisonyan commented 6 months ago

项目中并没有直接依赖vue-demi,是pinia所依赖的demi,参考https://github.com/nonzzz/vite-plugin-cdn/blob/master/docs/Q&A.md ,cdn配置中将demi放置在了pinia前面。 查看实际请求也没有下载demi相关的包 image

edisonyan commented 6 months ago

@edisonyan 能提供一份package.json吗 我想看看demi的版本

"dependencies": { "@ant-design/icons-vue": "^6.1.0", "@element-plus/icons-vue": "^2.3.1", "@imengyu/vue3-context-menu": "^1.3.3", "@sentry/vue": "^7.80.1", "@vueuse/core": "^10.5.0", "@wangeditor/editor": "^5.1.23", "@wangeditor/editor-for-vue": "^5.1.12", "ant-design-vue": "3.2.20", "axios": "^1.5.1", "diffable-html": "^5.0.0", "echarts": "5.4.1", "element-plus": "^2.4.4", "file-saver": "^2.0.5", "fuse.js": "6.6.2", "genson-js": "^0.0.8", "js-cookie": "3.0.1", "jsencrypt": "3.3.1", "json-schema-editor-vue3": "^1.2.0", "json-schema-faker": "0.5.3", "lodash-es": "^4.17.21", "monaco-editor": "0.33.0", "nprogress": "0.2.0", "pinia": "^2.1.7", "version-rocket": "^1.7.1", "vue": "3.3.6", "vue-clipboard3": "^2.0.0", "vue-cropper": "1.0.3", "vue-echarts": "^6.6.1", "vue-router": "4.1.4", "vuedraggable": "^4.1.0", "xlsx": "^0.18.5" }, "devDependencies": { "@rushstack/eslint-patch": "^1.5.1", "@sentry/vite-plugin": "^2.10.2", "@types/node": "^18.18.7", "@vitejs/plugin-vue": "^3.2.0", "@vue/eslint-config-prettier": "^7.1.0", "@vue/eslint-config-typescript": "^11.0.3", "@vue/tsconfig": "^0.1.3", "eslint": "^8.52.0", "eslint-plugin-vue": "^9.18.0", "prettier": "^2.8.8", "rollup-plugin-visualizer": "^5.9.2", "sass": "1.56.1", "typescript": "~4.8.4", "unplugin-auto-import": "0.11.4", "vite": "3.2.7", "vite-plugin-cdn2": "^1.0.0", "vite-plugin-compression": "0.5.1", "vite-plugin-monaco-editor": "^1.1.0", "vite-plugin-svg-icons": "2.0.1", "vite-plugin-vue-setup-extend": "0.4.0", "vue-tsc": "^1.8.21" }

nonzzz commented 6 months ago

@edisonyan 包管理器是pnpm吗?能提供一个debug日志么。 debug模式set DEBUG=vite-plugin-cdn2 & vite build

nonzzz commented 6 months ago

index.iife.min.js 就是demi

edisonyan commented 6 months ago

set DEBUG=vite-plugin-cdn2 & vite build

vite-plugin-cdn2 start scanning +0ms vite-plugin-cdn2 scanning done Map(8) { 'vue' => { name: 'vue', version: '3.3.6', relativeModule: 'dist/vue.global.js', aliases: [], bindings: Set(154) { 'BaseTransition', 'BaseTransitionPropsValidators', 'Comment', 'EffectScope', 'Fragment', 'KeepAlive', 'ReactiveEffect', 'Static', 'Suspense', 'Teleport', 'Text', 'Transition', 'TransitionGroup', 'VueElement', 'assertNumber', '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', 'defineModel', 'defineOptions', 'defineProps', 'defineSSRCustomElement', 'defineSlots', 'devtools', 'effect', 'effectScope', 'getCurrentInstance', 'getCurrentScope', 'getTransitionRawChildren', 'guardReactiveProps', 'h', 'handleError', 'hasInjectionContext', 'hydrate', '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', 'openBlock', 'popScopeId', 'provide', 'proxyRefs', 'pushScopeId', 'queuePostFlushCb', 'reactive', 'readonly', 'ref', 'registerRuntimeCompiler', ... 54 more items }, global: 'Vue' }, 'vue-demi' => { name: 'vue-demi', version: '0.14.6', relativeModule: 'lib/index.iife.js', aliases: [], bindings: Set(161) { 'Vue', 'Vue2', 'del', 'install', 'isVue2', 'isVue3', 'set', 'compile', 'Transition', 'TransitionGroup', 'VueElement', 'createApp', 'createSSRApp', 'defineCustomElement', 'defineSSRCustomElement', 'hydrate', 'initDirectivesForSSR', 'render', 'useCssModule', 'useCssVars', 'vModelCheckbox', 'vModelDynamic', 'vModelRadio', 'vModelSelect', 'vModelText', 'vShow', 'withKeys', 'withModifiers', 'devtools', 'EffectScope', 'ReactiveEffect', 'customRef', 'effect', 'effectScope', 'getCurrentScope', 'isProxy', 'isReactive', 'isReadonly', 'isRef', 'isShallow', 'markRaw', 'onScopeDispose', 'proxyRefs', 'reactive', 'readonly', 'ref', 'shallowReactive', 'shallowReadonly', 'shallowRef', 'stop', 'toRaw', 'toRef', 'toRefs', 'toValue', 'triggerRef', 'unref', 'camelize', 'capitalize', 'normalizeClass', 'normalizeProps', 'normalizeStyle', 'toDisplayString', 'toHandlerKey', 'BaseTransition', 'BaseTransitionPropsValidators', 'Comment', 'Fragment', 'KeepAlive', 'Static', 'Suspense', 'Teleport', 'Text', 'assertNumber', 'callWithAsyncErrorHandling', 'callWithErrorHandling', 'cloneVNode', 'compatUtils', 'computed', 'createBlock', 'createCommentVNode', 'createElementBlock', 'createElementVNode', 'createHydrationRenderer', 'createPropsRestProxy', 'createRenderer', 'createSlots', 'createStaticVNode', 'createTextVNode', 'createVNode', 'defineAsyncComponent', 'defineComponent', 'defineEmits', 'defineExpose', 'defineModel', 'defineOptions', 'defineProps', 'defineSlots', 'getCurrentInstance', 'getTransitionRawChildren', 'guardReactiveProps', ... 61 more items }, global: 'VueDemi' }, 'axios' => { name: 'axios', version: '1.5.1', relativeModule: 'dist/axios.min.js', aliases: [], bindings: Set(1) { 'default' }, global: 'axios' }, 'element-plus' => { name: 'element-plus', version: '2.4.4', relativeModule: 'dist/index.full.js', aliases: [], bindings: Set(432) { 'BAR_MAP', 'CASCADER_PANEL_INJECTION_KEY', 'CHANGE_EVENT', 'ClickOutside', 'CommonPicker', 'CommonProps', 'DEFAULT_FORMATS_DATE', 'DEFAULT_FORMATS_DATEPICKER', 'DEFAULT_FORMATS_TIME', 'DROPDOWN_COLLECTION_INJECTION_KEY', 'DROPDOWN_COLLECTION_ITEM_INJECTION_KEY', 'DROPDOWN_INJECTION_KEY', 'DefaultProps', 'DynamicSizeGrid', 'DynamicSizeList', 'EVENT_CODE', 'Effect', 'ElAffix', 'ElAlert', 'ElAside', 'ElAutoResizer', 'ElAutocomplete', 'ElAvatar', 'ElBacktop', 'ElBadge', 'ElBreadcrumb', 'ElBreadcrumbItem', 'ElButton', 'ElButtonGroup', 'ElCalendar', 'ElCard', 'ElCarousel', 'ElCarouselItem', 'ElCascader', 'ElCascaderPanel', 'ElCheckTag', 'ElCheckbox', 'ElCheckboxButton', 'ElCheckboxGroup', 'ElCol', 'ElCollapse', 'ElCollapseItem', 'ElCollapseTransition', 'ElCollection', 'ElCollectionItem', 'ElColorPicker', 'ElConfigProvider', 'ElContainer', 'ElCountdown', 'ElDatePicker', 'ElDescriptions', 'ElDescriptionsItem', 'ElDialog', 'ElDivider', 'ElDrawer', 'ElDropdown', 'ElDropdownItem', 'ElDropdownMenu', 'ElEmpty', 'ElFooter', 'ElForm', 'ElFormItem', 'ElHeader', 'ElIcon', 'ElImage', 'ElImageViewer', 'ElInfiniteScroll', 'ElInput', 'ElInputNumber', 'ElLink', 'ElLoading', 'ElLoadingDirective', 'ElLoadingService', 'ElMain', 'ElMenu', 'ElMenuItem', 'ElMenuItemGroup', 'ElMessage', 'ElMessageBox', 'ElNotification', 'ElOption', 'ElOptionGroup', 'ElOverlay', 'ElPageHeader', 'ElPagination', 'ElPopconfirm', 'ElPopover', 'ElPopoverDirective', 'ElPopper', 'ElPopperArrow', 'ElPopperContent', 'ElPopperTrigger', 'ElProgress', 'ElRadio', 'ElRadioButton', 'ElRadioGroup', 'ElRate', 'ElResult', 'ElRow', 'ElScrollbar', ... 332 more items }, global: 'ElementPlus' }, '@element-plus/icons-vue' => { name: '@element-plus/icons-vue', version: '2.3.1', relativeModule: 'dist/index.iife.min.js', aliases: [], bindings: Set(1) { 'default' }, global: 'ElementPlusIconsVue' }, 'echarts' => { name: 'echarts', version: '5.4.1', relativeModule: 'dist/echarts.min.js', aliases: [], bindings: Set(57) { 'Axis', 'ChartView', 'ComponentModel', 'ComponentView', 'List', 'Model', 'PRIORITY', 'SeriesModel', 'color', 'connect', 'dataTool', 'dependencies', 'disConnect', 'disconnect', 'dispose', 'env', 'extendChartView', 'extendComponentModel', 'extendComponentView', 'extendSeriesModel', 'format', 'getCoordinateSystemDimensions', 'getInstanceByDom', 'getInstanceById', 'getMap', 'graphic', 'helper', 'init', 'innerDrawElementOnCanvas', 'matrix', 'number', 'parseGeoJSON', 'parseGeoJson', 'registerAction', 'registerCoordinateSystem', 'registerLayout', 'registerLoading', 'registerLocale', 'registerMap', 'registerPostInit', 'registerPostUpdate', 'registerPreprocessor', 'registerProcessor', 'registerTheme', 'registerTransform', 'registerUpdateLifecycle', 'registerVisual', 'setCanvasCreator', 'setPlatformAPI', 'throttle', 'time', 'use', 'util', 'vector', 'version', 'zrUtil', 'zrender' }, global: 'echarts' }, 'json-schema-faker' => { name: 'json-schema-faker', version: '0.5.3', relativeModule: 'dist/bundle.js', aliases: [], bindings: Set(15) { 'JSONSchemaFaker', 'generateWithContext', 'generate', 'generateYAML', 'resolveWithContext', 'resolve', 'resolveYAML', 'format', 'option', 'random', 'extend', 'define', 'reset', 'locate', 'VERSION' }, global: 'location' }, 'pinia' => { name: 'pinia', version: '2.1.7', relativeModule: 'dist/pinia.iife.js', aliases: [], bindings: Set(15) { 'MutationType', 'PiniaVuePlugin', 'acceptHMRUpdate', 'createPinia', 'defineStore', 'getActivePinia', 'mapActions', 'mapGetters', 'mapState', 'mapStores', 'mapWritableState', 'setActivePinia', 'setMapStoreSuffix', 'skipHydrate', 'storeToRefs' }, global: 'Pinia' } } +4s vite v3.2.7 building for production...

edisonyan commented 6 months ago

index.iife.min.js 就是demi

看了下 是@element-plus/icons-vue image

nonzzz commented 6 months ago

👌有点奇怪我看看

nonzzz commented 6 months ago

@edisonyan 你是pnpm用户吗?我刚刚起了个demo调试发现是缺少了显示依赖导致scanner无法命中正确的模块 尝试给项目安装vue-demi

edisonyan commented 6 months ago

@edisonyan 你是pnpm用户吗?我刚刚起了个demo调试发现是缺少了显示依赖导致scanner无法命中正确的模块 尝试给项目安装vue-demi

是的 使用的pnpm,现在是需要安装vue-demi才行吗?

nonzzz commented 6 months ago

@edisonyan 对的 这是因为pnpm管理模块的机制导致的 无法扫描到幽灵依赖

nonzzz commented 6 months ago

@edisonyan 可以用了吗

edisonyan commented 6 months ago

该问题已解决,但是项目还有依赖andt vue 出现了一些报错,等我再调试下不行单开issue吧