在React中如何正确引入A-Frame实现VR场景？

我最近在用React做项目，想加个简单的VR展示，就试了A-Frame。但按照官网例子直接写标签，页面直接报错说“a-scene is not a valid JSX element”。

我查了下，好像React不认识自定义元素。网上有人说要用createElement或者加命名空间，但我试了都不行。有没有人成功在React里跑过A-Frame？具体该怎么写？

我现在代码大概是这样：

import React from 'react';
import 'aframe';

function VRScene() {
  return (
    <a-scene>
      <a-box position="0 1 -3" rotation="0 45 0" color="#4CC3D9"></a-box>
      <a-sky color="#ECECEC"></a-sky>
    </a-scene>
  );
}

export default VRScene;