如何将动画模型注入具有chrome扩展功能的A帧场景中？

Question

我正在开发chrome扩展程序，它将我的动画模型（使用推荐的gltf文件）添加到它在访问页面上检测到的任何A帧场景中。 这样做是通过将我的脚本注入页面中的-脚本检测场景并将新实体追加到场景。

根据https://aframe.io/docs/0.8.0/introduction/models.html#animating-models才能看到模型的动画，当我创建新实体以将其添加到场景时，我需要使用animation-mixer组件（来自https://github.com/donmccurdy/aframe-extras）。 （当我在自己的页面上以正常方式尝试模型时，可以看到模型具有适当的动画效果，而没有扩展名的干扰。）

我的猜测是，我必须使用webpack将A-frame，aframe-extras和我自己的脚本捆绑在一起，然后才能将其注入页面中。我的index.js当前看起来像这样：

console.log('log 1');
const AFRAME = require('aframe');
const aframeExtras = require('aframe-extras');
console.log('aframe', AFRAME);

const scene = document.querySelector('a-scene')
const myObj = document.createElement('a-entity')
myObj.setAttribute("gltf-model", "url(myModel.gltf)")
myObj.setAttribute("animation-mixer", "")

scene.appendChild(myObj)

然后我使用以下命令将其捆绑在终端中：npx webpack-没有配置文件。我没有错误，只是关于文件大小，配置和性能建议的友好警告。

在浏览器中，我得到此错误（当要求在第2行放上框架时）： 未捕获到的DOMException：无法在“文档”上执行“ registerElement”：类型“ a-node”的注册失败。无法从扩展注册元素。     在t.exports.registerElement ...

任何人都知道如何处理所有这些并将我的脚本/模型注入场景中进行动画处理？ （我以前在webpack和类似产品上的经验为零。）