How to use the botframework-webchat.renderWebChat function in botframework-webchat

import 'regenerator-runtime/runtime';
import {
    ActivityTypes,
    ConversationState,
    MemoryStorage
} from 'botbuilder-core';
import './css/app.css';
import { WebChatAdapter } from './webChatAdapter';
import { renderWebChat } from 'botframework-webchat';

// Create the custom WebChatAdapter.
const webChatAdapter = new WebChatAdapter();

// Connect our BotFramework-WebChat instance with the DOM.

renderWebChat({
    directLine: webChatAdapter.botConnection
}, document.getElementById('webchat')
);
// Instantiate MemoryStorage for use with the ConversationState class.
const memory = new MemoryStorage();

// Add the instantiated storage into ConversationState.
const conversationState = new ConversationState(memory);

// Create a property to keep track of how many messages are received from the user.
const countProperty = conversationState.createProperty('turnCounter');

// Register the business logic of the bot through the WebChatAdapter's processActivity implementation.
webChatAdapter.processActivity(async turnContext => {
    // See https://aka.ms/about-bot-activity-message to learn more about the message and other activity types.
    if (turnContext.activity.type === ActivityTypes.Message) {