Three js на React: модель не отображается

Я новичок в Three js. Моя задача - рендерить модель формата glb на странице браузера. Приложение написано на React. На данный момент мне удалось поставить канвас в нужном месте, и он присутствует в dom-дереве, имеет физический размер, но внутри него ничего нет. Посмотрите пожалуйста код, где ошибка?

import React, { useEffect } from 'react';
import { WrappedViewport } from './viewportStyle';
import { Scene, PerspectiveCamera, WebGLRenderer, AxesHelper } from 'three';
import { GLTFLoader } from 'three-stdlib';

const scene = new Scene();
scene.add(new AxesHelper(5));
const camera = new PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
const renderer = new WebGLRenderer();
renderer.setSize(600, 450);
const loader = new GLTFLoader();

const Viewport: React.FC = () => {

  useEffect(() => {
    const dom = document.querySelector('#render');
    if (dom) {
      dom.appendChild(renderer.domElement);
      loader.load('../../assets/models/jersey_rugby_fire/jersey_rugby_fire.fbx.glb', glb => {
        scene.add(glb.scene);
        renderer.render(scene, camera);
      });
    }
  }, [])

  return (
    <WrappedViewport>
      <div id='render'/>
    </WrappedViewport>
  );
}

export default Viewport;