前端打包:通过vite-plugin-cdn-import插件CDN引入vxe-table

   在打包前端项目的过程中,尝试使用vite-plugin-cdn-import来一如vxe-table,但是一直都报xxxxis not defined的错误。于是我上vxe-table官网查找cdn引入的方法,按照官网提供的引入顺序来引入。仍然报错,在查找了许多资料后,总结了以下要点。

一、使用cdn引入时最好锁定版本

在package.json中可以看到项目使用的插件的版本号,然后在https://www.jsdelivr.com/中查找插件的url

二、在main.ts或者main.js中引入

     通过cdn引入的插件需要挂载到main.ts中引入的插件名上(这样说不太准确)之后才能使用。

      注意每个插件要求的挂载名不同,我刚开始引入vxe-table使用的是VxeTable,结果一直报错,官网上也没有说明,最后是打开插件的下载路径,比如上图中https://cdn.jsdelivr.net/npm/vxe-table@4.7.72/lib/index.umd.min.js,注意到其中有个VXETable,然后讲引入名改成VXETable之后就不报错了。

三、var与mani.ts中的名字要一样

在vite.config.js中配置插件cdn时,var与main.ts中的挂载名要一致,不然到时候引入插件时,不知道挂载到哪里。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值