Reactのコンポーネントが呼び出せないです、、 お助け下さい><

Question

前提

ここに質問の内容を詳しく書いてください。
（例）
Reactを仕様してコンポーネントの使い方の学習をしています。

実現したいこと

コンポーネントを呼び出して画面に描画させたいです。

発生している問題・エラーメッセージ

Module not found: Error: Can't resolve './TextInput' in '/Users/divx/my-app/src'
ERROR in ./src/App.js 7:0-40
Module not found: Error: Can't resolve './TextInput' in '/Users/divx/my-app/src'

webpack compiled with 1 error

該当のソースコード

描画するためのページ
import * as React from "react";

import "./App.css";

import { TextInput } from "./TextInput";

const App = () => {
  return (
    <>
      aaaa aakdjsfa
      <TextInput />
    </>
  );
};

export default App;

呼び出したいコンポーネント
import { useState } from "react";

export const TextInput = () => {
  const [name, setName] = useState("");

  const hadleName = (event) => {
    setName(event.target.value);
  };

  return (
    <>
      <input
        onChange={(event) => hadleName(event)}
        type={"text"}
        value={name}
      />
    </>
  );
};

試したこと

src/App.js　
src/components/TextInput.tsx
ディレクトリ構成がおかしいと思い何度も確認、修正しましたが、ダメでした、、

ご教授よろしくお願い致しますm(_ _)m

Answer 1

src/App.js　の TextInput をimportする行を下記のように修正でどうでしょう？

- import { TextInput } from "./TextInput";
+ import { TextInput } from "./components/TextInput";

Comments

[hideo]

ご回答ありがとうございますm(_ _)m
解決しました！
ご丁寧な対応ありがとうございましたm(_ _)m