上海长宁区网站建设,fizz wordpress,建设企业网银,做网站有没有免费空间一、背景
从 vue2uview1 升级到 vue3vitetsuview-plus ,uview组件样式打包后不显示#xff0c;升级前uview 组件是可以正常显示#xff0c;升级后本地运行是可以正常显示#xff0c;但是打包发布成H5后uview的组件无法正常显示#xff0c;其他uniapp自己的组件可以正常显示…一、背景
从 vue2uview1 升级到 vue3vitetsuview-plus ,uview组件样式打包后不显示升级前uview 组件是可以正常显示升级后本地运行是可以正常显示但是打包发布成H5后uview的组件无法正常显示其他uniapp自己的组件可以正常显示。折腾了很久这里记录下我是如何解决的
二、排查过程
当然过程很痛苦百度也未能找到这种类似的问题各种排查和尝试。也一度以为是uview-plus框架本身的问题。
令人不解的是本地运行正常就打包h5后运行就g了。
各种尝试和折腾后真是束手无策了于是又在Mac上试试看看是否环境或者node版本问题换个环境连编译都通不过了直接报如下错误 looseToNumber is not exported by ../../../../../../Users/wanzhou/Documents/HBuilderProjects/xiaovie_uni/node_modules/.pnpm/registry.npmmirror.comvueshared3.2.39/node_modules/vue/shared/dist/shared.esm-bundler.js, imported by node_modules/dcloudio/uni-h5-vue/dist/vue.runtime.esm.js.
at ../../../../../Applications/HBuilderX.app/Contents/HBuilderX/plugins/uniapp-cli-vite/node_modules/dcloudio/uni-h5-vue/dist/vue.runtime.esm.js:1:203
import { extend, isArray, isMap, isIntegerKey, hasOwn, isSymbol, isObject, hasChanged, makeMap, capitalize, toRawType, def, isFunction, NOOP, isString, isPromise, getGlobalThis, EMPTY_OBJ, toHandlerKey, looseToNum...
export { camelize, capitalize, normalizeClass, normalizeProps, normalizeStyle, toDisplayString, toHandlerKey } from vue/shared;
import { isRootHook, isRootImmediateHook, ON_LOAD, createRpx2Unit, defaultRpx2Unit } from dcloudio/uni-shared;
Build failed with errors.
三、发现问题
通过报错去查看源码源码里的确没有 looseToNumber 这个家伙我再想会不会因为有uniapp的js类库没有走HBuilder自带的dcloudio类库而走的npm安装的类库的问题仔细查看 package.json 文件里面有引入dcloudio类库这里dcloudio依赖我也是从其他Vue3vitets项目迁移复制过来的当时没有去深入考虑。 于是乎我把开头的全部删掉再删除node_modules接着运行 pnpm install 重新安装并打包H5放nginx下运行如有提示缺的依赖再单独装一下终于全部uview-plus组件正常显示了。
删除整理后的 package.json 依赖内容 四、总结
1. 这里的Vue本地运行正常打包后样式无法正常显示是由于用npm导入了一部分uniapp的dcloudio类库和HBuilder自带的dcloudio一起用导致版本不一致导致的问题。
2. 我们在升级迁移项目中遇到问题还是要深入分析源码能帮助我们理解底层原理和快速定位解决问题。