Javascript &引用；值已声明，但从未读取；但我要宣布价值

我正在尝试在React中建立一个投资组合网站，我对React非常陌生（大约3天），我已经为网站导航栏导入了一些代码，并在代码中声明了它，但它没有显示在网站上，vscode说没有声明该值。我该如何解决这个问题

我试着将代码转换成一个组件并重新排列代码，但仍然得到相同的结果

---

App.js-主代码

import React from 'react';
import './App.css';
import navBar from './navBar/navBar';

function App() {
  return (
    <div className="app">
      //navBar that won't show up
      <navBar />
      <div className="landingPage"></div>
      <div className="projectPage"></div>
      <div className="aboutPage"></div>
      <div className="footer"></div>
    </div>
  )
}

export default App;

从“React”导入React；
导入“/App.css”；
从“./navBar/navBar”导入导航栏；
函数App（）{
返回(
//不会出现的导航栏
)
}
导出默认应用程序；

---

导航栏的代码

import React from "react";
import "./navBar.css";

function navBar() {
    return (
        <div>
            <h1>NAVBAR PLACEHOLDER</h1>
        </div>
    )
}

export default navBar;

从“React”导入React；
导入“/navBar.css”；
函数navBar（）{
返回(
导航栏占位符
)
}
导出默认导航栏；

你的问题标题有点古怪。您已修复代码中的值错误。但组件仍然存在错误：

//navBar that won't show up
<navBar />

//不会显示的导航栏

在react中，自定义构建组件名称应始终以大写字母开头。这样做：

import NavBar from './navBar/navBar';
// --  ^^ you can name it anything as it's default import

<NavBar />

从“./NavBar/NavBar”导入导航栏；
//-->您可以将其命名为默认导入

您确定。/navBar/navBar.js是正确的路径吗？react组件应该使用大写的第一个字母。应该吗？还是必须？既然总是有这个词，我想没关系。顺便说一句，如果我们愿意，我们也可以使用小写组件：）

{navBar（）}

。只有HTML标记才需要大写。在技术规范中，“应该”和“必须”这两个词是非常具体和不同的。“应该”仅为建议，带或不带“始终”