Рамка внутри Stencil JS веб-компонента - PullRequest
Новая
       87

Рамка внутри Stencil JS веб-компонента

0 голосов
/ 29 апреля 2020

извините за мой фиктивный вопрос.

Я хотел бы создать некоторые веб-компоненты, используя a-frame. Например: 

<html dir="ltr" lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0">
  <title>Stencil Component Starter</title>
  <script src="https://aframe.io/releases/1.0.4/aframe.min.js"></script>
  <script type="module" src="/build/iseeve3d.esm.js"></script>
  <script nomodule src="/build/iseeve3d.js"></script>

</head>
<body>
  <a-scene>
    <my-component />
  </a-scene>
</body>
</html>

В компоненты у меня есть: 


@Component({
  tag: 'my-component',
  styleUrl: 'my-component.css',
  shadow: true
})
export class MyComponent {
  render() {
    return (
    <Host>
        <a-box position="-1 0.5 -3" rotation="0 45 0" color="#4CC3D9"></a-box>
        <a-sphere position="0 1.25 -5" radius="1.25" color="#EF2D5E"></a-sphere>
        <a-cylinder position="1 0.75 -3" radius="0.5" height="1.5" color="#FFC65D"></a-cylinder>
        <a-plane position="0 0 -4" rotation="-90 0 0" width="4" height="4" color="#7BC8A4"></a-plane>
        <a-sky color="#ECECEC"></a-sky>
    </Host>);
  }
}

Но это не работает. Что не так? Я также пытался включить библиотеку aframe npm, но кажется невозможным использовать такие компоненты, как библиотека npm.

Пожалуйста, помогите мне. Спасибо

...