javascript - 如何在具有跨浏览器支持的自定义 Dojo 构建中包含 dojox.gfx.SVG 和 dojox.gfx.VML？

Question

我正在使用dojo.gfx在我的网站上创建矢量形状和文本，当我“dojo.require”-ing我的Javascript中的所有依赖项时，一切正常。但是，当我在自定义构建中构建所需的所有内容时(尤其是 dojox.gfx、dojox.gfx.svg 和 dojox.gfx.vml>)，Dojo 对支持 SVG 的浏览器和 IE (VML) 的自动区分似乎正在被打破。

如果我只包含 dojox.gfx.svg，IE 会崩溃(见下文)，如果我添加 dojox.gfx.vml，我的脚本将在 Firefox 中停止工作。

在 IE 中，脚本在我的自定义 dojo 构建的以下行中中断，显示“对象不支持属性或方法”:

*s.rawNode = _createElementNS(svg.xmlns.svg, "svg");*

其中 _createElementNS 被注释为“用于处理创建命名空间元素的内部帮助程序。主要是为了在 IE 上运行 SVG 标记输出。”。

没错，我在 dojo 构建配置文件中排除了 SVG 和 VML，并让 dojo xhr 获取其余部分。这可以工作，但需要另外三个请求(svg.js、shape.js、path.js，尽管后两个包含在我的构建中)。

我需要在构建中包含哪些内容才能使矢量形状在所有浏览器中“开箱即用”工作？

这是我的构建配置文件，它可以工作，但需要额外的三个请求(因此 svg 和 vml 都没有明确包含):

dependencies ={
layers:  [
    {
    name: "mybuild-dojo.js",
    dependencies: [
     "dojo.fx",
     "dojox.gfx",
     "dojox.gfx.shape",
     "dojox.gfx.path",
     "dojox.gfx.VectorText",
     "dojox.xml.DomParser",
     "dojox.image.Lightbox",
     "dojo.parser"
    ]
    }
],
prefixes: [
    [ "dijit", "../dijit" ],
    [ "dojox", "../dojox" ],
]

};

感谢您的回答。

Answer 1

不幸的是，dojox.gfx 代码的构建假设在运行时引入了正确的渲染器(svg 或 vml)。因此，只需引入顶级 dojox.gfx 的构建就是正确的选择。

您可能可以破解代码，在 svg 的 dojox.gfx 文件周围放置一个 if(dojox.gfx.renderer == "svg"){} 。也许查看 dojox.gfx 源代码和底部的 dojo.requireIf() 调用将给出如何包装每个模块的想法。