找回密码
 立即注册

QQ登录

只需一步,快速开始

何时待我

高级会员

44

主题

225

帖子

1053

积分

高级会员

积分
1053
何时待我
高级会员   /  发表于:2023-2-15 09:05  /   查看:2164  /  回复:16
1金币
本帖最后由 何时待我 于 2023-2-15 09:09 编辑

如题, 通过externals 排除SpreadJS 相关包, 使用CDN 进行引入, 类似如下图方式处理
image.png240852965.png

最佳答案

查看完整内容

可以使用如下方式在打包时排除SpreadJS, 然后动态的在index.html 注入CDN 资源链接, 本地(development)仍然可以使用import 引入, 但是不可使用组件化渲染excel, 算是折中方案 如果CDN资源引入的方式也能支持组件化调用就好了

16 个回复

倒序浏览
最佳答案
最佳答案
何时待我
高级会员   /  发表于:2023-2-15 09:05:39
来自 9#
本帖最后由 何时待我 于 2023-3-2 10:33 编辑
Lynn.Dou 发表于 2023-3-2 09:53
欢迎分享下您的解决方案,来帮助更多的小伙伴学习,这边也会给您送上金币奖励。
本贴就先结贴了, ...

可以使用如下方式在打包时排除SpreadJS, 然后动态的在index.html 注入CDN 资源链接, 本地(development)仍然可以使用import 引入, 但是不可使用组件化渲染excel, 算是折中方案
如果CDN资源引入的方式也能支持组件化调用就好了

  1. externals: [function (...args) {
  2.         const [arg1, arg2, arg3] = args;
  3.         let request = arg2;
  4.         let callback = arg3;
  5.         if (arg1 && arg1.context && arg1.request) {
  6.             // context = arg1.context;
  7.             request = arg1.request;
  8.             callback = arg2;
  9.         }
  10.         if (/^@grapecity/.test(request)) {
  11.             return callback(null, "GC");
  12.         }
  13.         // 继续下一步且不外部化引用
  14.         callback();
  15.     }],
复制代码

评分

参与人数 1金币 +500 收起 理由
Lynn.Dou + 500 很给力!

查看全部评分

回复 使用道具 举报
Lynn.Dou讲师达人认证 悬赏达人认证 SpreadJS 开发认证
超级版主   /  发表于:2023-2-15 15:05:42
2#
您好,
影响打包体积的是 是否cdn方式引入资源,
简单来说,externals 的作用是,在通过cdn引入第三方依赖后,仍可以以import的方式加载。
具体可以参考这篇文章:
https://blog.csdn.net/qq_37899792/article/details/103364836

而对于SpreadJS,您可以在引入cdn资源后,直接在需要用到SpreadJS的vue文件中调用API,无需再import,所以externals可以不配置。

附件为cdn引入SpreadJS的示例demo,供参考。

vue_cdn_load.zip

174.51 KB, 下载次数: 118

回复 使用道具 举报
何时待我
高级会员   /  发表于:2023-2-15 17:41:51
3#
Lynn.Dou 发表于 2023-2-15 15:05
您好,
影响打包体积的是 是否cdn方式引入资源,
简单来说,externals 的作用是,在通过cdn引入第三方依 ...

因为项目里现在是使用import 引入资源的, 包太大, 所以想使用externals 在打包的时候排除一些第三方依赖, 其中包含SpreadJS, SpreadJS 支持externals 进行排除吗
回复 使用道具 举报
Lynn.Dou讲师达人认证 悬赏达人认证 SpreadJS 开发认证
超级版主   /  发表于:2023-2-15 18:16:47
4#
1楼做了说明,参考1楼demo用cdn的方式引入资源即可。
externals的作用主要是是否在cdn引入的方前提下支持import方式使用,具体作用可以看下1楼链接文章的介绍。
回复 使用道具 举报
何时待我
高级会员   /  发表于:2023-2-16 10:42:41
5#
Lynn.Dou 发表于 2023-2-15 18:16
1楼做了说明,参考1楼demo用cdn的方式引入资源即可。
externals的作用主要是是否在cdn引入的方前提下支持i ...

所以SpreadJS 是没法使用externals , 只能使用 cdn方式 或者import方式
如果是这样, 那没问题了
回复 使用道具 举报
Lynn.Dou讲师达人认证 悬赏达人认证 SpreadJS 开发认证
超级版主   /  发表于:2023-2-16 13:49:52
6#
何时待我 发表于 2023-2-16 10:42
所以SpreadJS 是没法使用externals , 只能使用 cdn方式 或者import方式
如果是这样, 那没问题了

是的,您可以cdn引入后直接调用GC接口
回复 使用道具 举报
何时待我
高级会员   /  发表于:2023-3-2 09:42:00
7#
Lynn.Dou 发表于 2023-2-16 13:49
是的,您可以cdn引入后直接调用GC接口

已经找到方法使用 externals 排除SpreadJS, 可以结贴了
回复 使用道具 举报
Lynn.Dou讲师达人认证 悬赏达人认证 SpreadJS 开发认证
超级版主   /  发表于:2023-3-2 09:53:50
8#
欢迎分享下您的解决方案,来帮助更多的小伙伴学习,这边也会给您送上金币奖励。
本贴就先结贴了,有问题欢迎另开新帖交流。
回复 使用道具 举报
Lynn.Dou讲师达人认证 悬赏达人认证 SpreadJS 开发认证
超级版主   /  发表于:2023-3-2 11:35:09
10#
回复 使用道具 举报
12下一页
您需要登录后才可以回帖 登录 | 立即注册
返回顶部