How to use the @aws-amplify/xr.configure function in @aws-amplify/xr

import { Component, State, h } from '@stencil/core';
import { AuthenticatorExample } from './authenticator-example';
import example4 from './example4';
import sceneExample from './scene-example';
import Auth from '@aws-amplify/auth';
import XR from '@aws-amplify/xr';
import awsexports from './src/aws-exports';

Auth.configure(awsexports);
XR.configure(awsexports);

const examples = [AuthenticatorExample, example4, sceneExample];

(window as any).LOG_LEVEL = 'DEBUG';

const Tabs = ({ active, set }) => (
  <ul>
    {examples.map(({ title }, index) =&gt; (
      <li class="{active">
        <a> set(index)} href="javascript:void(0);"&gt;
          {title}
        </a>
      </li>
    ))}
  </ul>
);

import { h } from '@stencil/core';
import Auth from '@aws-amplify/auth';
import XR from '@aws-amplify/xr';
import awsexports from './src/aws-exports';

Auth.configure(awsexports);
XR.configure(awsexports);

const sceneExample = () => ;

export default {
  title: 'Scene example',
  Content: sceneExample,
};