vue3使用大屏dataV问题解决

前言：家人们，大家好！今天分享一篇文章给大家！要是文章对你有帮助，激发了你的灵感，

求个收藏 + 关注啦～后续还有超多惊喜，别错过！

引言 

这里咱们使用的是datav    vue2版本的@jiaminghi/data-view 

vue3版本datav有很多问题  所以在vue3中使用 vue2版本datav  需要进行适配一下，下面是步骤

1.安装依赖 

npm install @jiaminghi/data-view

2.main.js中全局引入dataV 

3.dataV插件报错，在vue2中 template 标签循环不可添加key，vue3 template 标签循环必须要同时添加key，修改node_modules文件

 根据控制台报错找到所在文件修改即可

改为下面这种格式 

 4.在当前使用 Vite 创建的 Vue 3 项目中，存在一个情况，即项目暂时支持引入 dataV。为了实现这一引入，对 node_modules 包进行了相应的调整修改。然而，考虑到团队协作的便利性，显然不能让团队成员每次拉取项目时都去手动进行这些修改操作。所以我们使用 patch-package 插件记录包的改动，并同步到团队每个成员

5.下载 patch-package 依赖

npm i patch-package

6.上面 3步骤 修改node_modules文件 保存好后执行下面指令

npx patch-package @jiaminghi/data-view

 

 等待生成 就搞定了

配置好 package.json 中添加  "postinstall": "patch-package"

最后 

就搞定了，提交git 或svn 代码  团队其他人 npm  i     就可以直接使用了

注意：

刚开始引入组件时 可以会遇到报错

Uncaught SyntaxError: The requested module '/node_modules/@jiaminghi/c-render/lib/index.js?v=61137ffc' does not provide an export named 'default' (at main.vue:2:8)

在vite.config.js 中加入这些

到这里，这篇文章就和大家说再见啦！我的过往文章里还藏着许多干货，感兴趣的话也可以点击我的主页看看，下面的文章也很精彩，可别错过。创作这篇内容花费了不少心血，要是它帮你解决了问题，或者带来了启发，就多多支持下 “码上前端” 吧～要是想转载，麻烦一定注明本文链接，感谢大家！ 💕