Question

我想使用来自aframe-extras https://github.com/donmccurdy/aframe-extras/tree/master/src/shadows的shadow之类的组件

如何在A-Frame场景中使用或安装外部组件？

<html>
  <head>
    <script src="https://aframe.io/releases/0.3.2/aframe.min.js"></script>
  </head>
  <body>
    <a-scene>
      <a-box color="red" position="0 0 -4"></a-box>
    </a-scene>
  </body>
</html>

Answer 1

通常，GitHub上发布的A-Frame组件遵循相同的模板。在这种情况下，影子组件的JS文件位于根dist/文件夹中的https://github.com/donmccurdy/aframe-extras/blob/master/dist/aframe-extras.shadows.js ...。

要从我们的场景外部包含JS文件，我们可以只使用一些允许CORS的CDN服务：rawgit.com或unpkg.com。在aframe之后的<head>中的脚本标记

<html>
  <head>
    <script src="https://aframe.io/releases/0.3.2/aframe.min.js"></script>
    <script src="https://rawgit.com/donmccurdy/aframe-extras/master/dist/aframe-extras.shadows.js"></script>
    <!-- or <script src="https://unpkg.com/aframe-extras/dist/aframe-extras.shadow.js"></script>
  </head>
</html>

然后只使用HTML中的组件

<a-scene>
  <a-box color="red" position="0 0 -4" shadow="cast: true; receive: true"></a-box>
  <a-light shadow-light="cast-shadow: true"></a-light>
</a-scene>

所以只需两个步骤：为组件添加脚本标记，使用组件。

如何在A-Frame场景中安装社区/第三方组件？

1 个答案: