vue项目中怎么使用TDesign


这篇文章主要介绍“vue项目中怎么使用TDesign”,在日常操作中,相信很多人在vue项目中怎么使用TDesign问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”vue项目中怎么使用TDesign”的疑惑有所帮助!接下来,请跟着小编一起来学习吧!tdesign-vue是TDesign 适配桌面端的组件库,适合在 vue 2 技术栈项目中使用。当前只适配vue2.6.X如果版本高于vue2.7将报错,因为vue2.6与vue2.7不兼容。在待创建项目的文件夹下打开cmd输入下列指令项目名称不能有中文-且英文字母都要求小写错误案例:myVueAppNamevue版本选择vue2创建完项目后,在package.json或package-lock.json中查看vue的版本,如果vue的版本不是2.6.X,进入项目文件夹,打开cmd,使用以下命令修改vue版本。然后更新模板编译器vue-template-compiler的版本,使得vue和vue-template-compiler版本匹配。tdesign-vue安装使用下列命令如果安装失败,说明vue版本不匹配,需要更换vue版本。更换版本后可能导致之前的某些库无法兼容,所以更换vue前记得备份。对于不是新创建的vue项目(现有项目)有时候会出现package.json文件中vue版本是2.6但实际版本是2.7的情况,可以通过查看node_modulesvuepackage.jso免费云主机域名n的version确定实际安装的版本。less是一种css预处理器,tdesign的css样式使用less,但vue项目不自带less包,所以需要额外安装,安装使用下列命令安装完毕在main.js中全局引入tdesign(目的是测试较为复杂的组件,为简化操作使用全局引入,后续开发可改为按需引入)。完整main.js代码在组件文件夹创建测试组件,组件文件命名采用驼峰命名法,否则可能报错。
驼峰命名法:至少由2组单词组成且每个单词首字母大写例如:TextBox、MyAppToolBox、Bottom21
错误示范:textinput、myappbar
如果不想使用此校验,在在vue.config.js的defineConfig中添加规则lintOnSave:false测试组件:顶部导航栏,使用TDesign官网给出的源码示例在App.vue中引入该组件App.js完整代码-仅作参考运行vue项目查看是否报错vue模板编译器版本与vue版本不匹配vue版本高于vue2.6组件文件名未使用驼峰命名法less的less-load模块未安装到此,关于“vue项目中怎么使用TDesign”的学习就结束了,希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习,快去试试吧!若想继续学习更多相关知识,请继续关注百云主机网站,小编会继续努力为大家带来更多实用的文章!

相关推荐: 怎么使用Python+tkinter实现网站下载工具

今天小编给大家分享一下怎么使用Python+tkinter实现网站下载工具的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。python 3.8: …

免责声明:本站发布的图片视频文字,以转载和分享为主,文章观点不代表本站立场,本站不承担相关法律责任;如果涉及侵权请联系邮箱:360163164@qq.com举报,并提供相关证据,经查实将立刻删除涉嫌侵权内容。

(0)
打赏 微信扫一扫 微信扫一扫
上一篇 06/21 12:23
下一篇 06/21 12:24

相关推荐