如何将 community/third-party 组件安装到我的 A-Frame 场景中?
How do I install a community/third-party component into my A-Frame scene?
我想使用来自 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>
通常,GitHub 上发布的 A-Frame 组件遵循相同的模板。在这种情况下,影子组件的 JS 文件位于 https://github.com/donmccurdy/aframe-extras/blob/master/dist/aframe-extras.shadows.js ... 根 dist/
文件夹中。
要从我们的场景外部包含 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>
所以只需两步:为组件添加脚本标签,使用组件。
我想使用来自 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>
通常,GitHub 上发布的 A-Frame 组件遵循相同的模板。在这种情况下,影子组件的 JS 文件位于 https://github.com/donmccurdy/aframe-extras/blob/master/dist/aframe-extras.shadows.js ... 根 dist/
文件夹中。
要从我们的场景外部包含 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>
所以只需两步:为组件添加脚本标签,使用组件。