class型コンポーネントをexportしてもobjectとしてimportされる

Question

やりたいこと

Reactのcomponentをnpmにnode_moduleとして公開したいです。

##起きたこと
webpackで出来たものをbundleして、それをimportしてもobjectとしてimportされエラーが起きる。ローカルサーバーで建てたときはうまくimportできました。
出てくるエラーはこんな感じです。
エラーの内容を見てもどこがミスっててるのかがいまいちわかりません。
皆さんの知見をお貸しください。

##コード
index.tsx(bundleするComponent)

import React from 'react'
interface(以下略)
export default class App extends React.Component<Props,State>{
    render(){
        return(
            <div>
                This is App
            </div>
        )
}

package.json

{
    "name":"test-app",
    (略)
    "main":"lib/bundle.js",
    "scripts":{
        "start":"webpack-dev-server --mode development",
        "build":"webpack --mode production"
    },
    (略)
}

webpack.config.js

const path = require('path');

module.exports = {
    mode:"production",
    entry: path.join(__dirname,"./App.tsx"),
    module: {
        rules: [
            {
                test: /.ts(x?)$/,
                loader: 'ts-loader',
                exclude: /node_modules|lib/,
            },
            {
                test: /.js(x?)$/,
                loader:'babel-loader',
                exclude: /node_modules|lib/,
            },
            {
                test: /.scss$/,
                use:["style-loader","css-loader","sass-loader"]
            },
            {
                test: /.css$/,
                use:["style-loader","css-loader"]
            }
        ]
    },
    resolve: {
        modules: ["node_modules"],
        extensions: ['.js','.jsx','.ts','.tsx']
    },
    output: {
        path: path.join(__dirname,"./lib/"),
        filename: "bundle.js"
    }
}

index.js(node_moduleをimportする側)

import React from 'react'

import App from 'test-app'

interface(略)

export default class Test extends React.Component <Props,State> {
    render(){
        return(
            <div>
                <App />
            </div>
        )
    }
}

よろしくお願いします！！

Comments

[teloo]

以下について確認いただけますでしょうか？

1. test-app は index.js で呼び出す側の node_modules 下に npm build 後で存在するという認識で正しいでしょうか？
2. lib/bundle.js の内容はどのようになっているのでしょうか？
3. index.js の `render()` 内の return の前に `console.log(App);` すると、どのような出力がされるのでしょうか？

1 で、念のために前提条件を確認します。

2 の意図は、index.js が実際に import する対象は TypeScript を JavaScript に変えた後だからです。

3 の意図は、React の コンポーネントは関数かクラスを想定していたが、オブジェクトだったというエラーメッセージだと認識しています。
では、どのようなオブジェクトとなっていたのかをこれで把握したいです。