无法使用 React 导入组件

Question

所以我进入了 React，我看不到我的组件，只有 CSS 的背景图像。

这是我的 App.jsx：

import React from 'react'
import Header from './components/header/Header'
import Nav from './components/nav/Nav'
import About from './components/about/About'
import Experience from './components/experience/Experience'
import Services from './components/services/Services'
import Portfolio from './components/Portfolio/Portfolio'
import Testimonials from './components/Testimonials/Testimonials'
import Contact from './components/contact/Contact'
import Footer from './components/footer/Footer'

const App = () => {
  return (
    <>
      <Header />
      <Nav />
      <About />
      <Experience />
      <Services />
      <Portfolio />
      <Testimonials />
      <Contact />
      <Footer />
    </>   
  )
}

export default App

HTML：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>The Ultimate React Personal Portfolio Website</title>
   
</head>
<body>
    <div id="root"></div>
</body>
</html>

我究竟做错了什么？

我已将 import React 从 'react 更改为 import React from 'react-dom' 无济于事。 请帮忙

抱歉，我删除了一个令人困惑的部分，并包含了一些片段以供进一步澄清。

这是我的项目文件夹的屏幕截图

这也是我的 index.js：

import ReactDOM from 'react-dom'
import App from './App'
import './style.css'

ReactDOM.render(<App/>, document.querySelector("#root"))

Answer 1

直到我没有从您的控制台中看到日志，我才能假设我错了。
这是一篇非常新鲜的帖子，我假设您使用的是最新版本的 react 18。
希望这会有所帮助:)

// React 17 
import ReactDOM from 'react-dom'
import App from './App'

ReactDOM.render(<App/>, document.querySelector("#root"))

// React 18
import ReactDOM from 'react-dom/client'
const container = document.getElementById('app')
const root = ReactDOM.createRoot(container) // createRoot(container!) if you use TypeScript
root.render(<App tab="home" />)

无法使用 React 导入组件

问题描述

1 个解决方案

解决方案1
-1 已采纳 2022-07-14 03:50:48

无法使用 React 导入组件

问题描述

1 个解决方案

解决方案1 -1 已采纳 2022-07-14 03:50:48

解决方案1
-1 已采纳 2022-07-14 03:50:48