Vue doesn't work in React

[nesymno]

Hey there! I have a trouble with Vue component inside React. I'm using HOC API, like in docs (here).

But get an error: InvalidCharacterError: Failed to execute 'createElement' on 'Document': The tag name provided ('/static/media/OpenApi.6037cdb6.vue') is not a valid name.

How I do that:

import React, {Component} from 'react'
import {BreadcrumbsItem} from 'react-breadcrumbs-dynamic'
import {VueInReact} from 'vuera'
import OpenApi from 'vue-openapi'
import {getApiData} from './actions'
import VueComponent from '../../../components/Vue/VueComponent.vue'

export default class Openapi extends Component {
    state = {
        json_api: {}
    }

    render () {
        const Component = VueInReact(OpenApi)
        return (
            <div>
                <BreadcrumbsItem to="/openapi">Open API</BreadcrumbsItem>
                <Component/>
                <vue-component></vue-component>
                <open-api></open-api>
            </div>
        )
    }

    async componentDidMount () {
        let data = await getApiData()

        console.log(data)

        this.setState({
            ...this.state,
            json_api: data.data
        })
    }
}

In this case, and components didn't compiled. But (this is the way like in docs) shows me error above. Help! Thanks!

If I use wrapper component, console shows me: Invalid Component definition

[akxcv]

Hi! Judging by the source code of vue-openapi, the main exported component of the library is a raw Vue template component, not processed in any way. To work with such components, you have to make sure your module bundler (webpack?) is configured properly.

[akxcv]

Closing due to inactivity.