1件目の方が回答されている通り、
どのようにReactアプリケーションを作成されたか見えない部分はありますが、
以下コマンドで作成されたのではないかな～～と思っているところです。
npx create-react-app XXXX
おそらくと言っているのは、私がReactを多少は触っていること・また共有いただいたコードを元に、推測したためです。
今回のような質問の場合は、以下の情報があると、
回答する方への気遣いがなされた質問になると思います。
- どのようにアプリケーションの土台を作成したか
- どのようなフォルダ構成になっているか
不鮮明な部分はあるので、
以下の内容にそって修正したから、必ず動くというわけでないですが、
気になった点を共有します。
index.jsxの記述
import { XXXXX } from 'YYYY';という記述は何度も登場しますが、先頭がexportとなっていて、fromも記述するような構造で記述するような実装は、出てこないはずです。。
日本語っぽく言えば、YYYYから(from)XXXXXXをインポート(import)する、なので。
またindex.jsに、headerコンポーネントのimportの記述？と思いますが、いらないと思います。
header.jsxがある階層とコンポーネント名
App.jsに記述されている内容を見ると、
from './components'
となっています。srcフォルダの下に、componentsフォルダがあって、その中にindex.jsxを作成したと受け取りました。
headerという単語は、htmlタグとしても存在するので、少し名前は変えた方がいいかもしれません。例えばですが、以下のように。
const HeaderComp = () => {
return (略)
}
export default HeaderComp;
以上です。頑張ってください。
2Like
