antvis/G2

g2 在IE11浏览器上运行空白,报错 #5394

Azariasa posted onGitHub

<!-- Thank you for reporting an issue. 1. It's RECOMMENDED to submit PR for typo or tiny bug fix. 2. If this's a FEATURE request, please provide: details, pseudo codes if necessary. 3. If this's a BUG, please provide: course repetition, error log and configuration. Fill in as much of the template below as you're able. 4. It will be nice to use to provide a CodePen Link which can reproduce the issue, we provide a CodePen template g2-github-issue. 感谢您向我们反馈问题。 1. 提交问题前,请先阅读 README 中的贡献帮助文档。 2. 我们推荐如果是小问题(错别字修改,小的 bug fix)直接提交 PR。 3. 如果是一个新需求,请提供:详细需求描述,最好是有伪代码实现。 4. 如果是一个 BUG,请提供:复现步骤,错误日志以及相关配置,并尽量填写下面的模板中的条目。 5. 如果可以,请提供尽可能精简的 CodePen 链接,可使用 CodePen 模板 https://codepen.io/leungwensen/pen/WXJgox,方便我们排查问题。 6. 扩展阅读:如何向开源项目提交无法解答的问题 -->

  • G2 Version: 5.0.12
  • Platform: windows
  • Mini Showcase(like screenshots):
  • CodePen Link:

<!-- Enter your issue details below this comment. -->

g2在低代码平台中引入,项目打包后再IE11浏览器上运行空白,报错信息如下:

image

报错信息代码为:

跟踪代码,变量值this为: image


还有更详细的具体代码截图吗?

posted by hustcc over 1 year ago

这个是源码报错的截图:

Snipaste_2023-08-15_09-42-51

posted by Azariasa over 1 year ago

这里的 this 是 g 的 element,style 是一个 proxy,@xiaoiver 看看?

posted by pearmini over 1 year ago

Proxy 是 ES6 的特性,我们使用它支持 shape.style.xx = 2 这样的语法: https://stackoverflow.com/a/45453750

如果想支持 IE11,可能有两种方式:

  1. 让使用者在构建流程中尝试引入 Polyfill:https://github.com/GoogleChrome/proxy-polyfill
  2. G2 GUI 避免使用上面的语法,改成 shape.attr({ xx: 2 })

@Azariasa 可否先尝试一下第一种方案?我们再讨论一下第二种方式

posted by xiaoiver over 1 year ago

Proxy 的浏览器兼容好像就是到 IE11,不过 vue 3.0 也是使用的这个。

下图发现 mdn 已经不显示 ie 的兼容性了。

image

posted by hustcc over 1 year ago

让使用者在构建流程中尝试引入 Polyfill:https://github.com/GoogleChrome/proxy-polyfill

因我们项目是打包之后在IE11中运行,我将此项目中的 proxy.min.js 引入页面,还是会报同样的错。

页面引入方式如下: Snipaste_2023-08-15_09-42-51

@xiaoiver

posted by Azariasa over 1 year ago

把项目的 target 打包的 target 设置成 es5?

posted by pearmini over 1 year ago

Fund this Issue

$0.00
Funded

Pull requests