I am building a React project with Vite. I was using a tutorial from an article that I found at https://www.digitalocean.com/community/tutorials/how-to-set-up-a-react-project-with-vite.
I followed the tutorial as described, however, my “greeting” component will not load.
JavaScript
x
12
12
1
import React from 'react';
2
3
function greeting() {
4
return (
5
<div>
6
Hello World!
7
</div>
8
);
9
}
10
11
export default greeting;
12
JavaScript
1
15
15
1
import React from 'react';
2
import greeting from "./greeting";
3
4
5
function App() {
6
return (
7
<main>
8
React⚛️ + Vite⚡ + Replit🌀
9
<greeting />
10
</main>
11
);
12
}
13
14
export default App;
15
JavaScript
1
14
14
1
import { StrictMode } from "react";
2
import { createRoot } from "react-dom/client";
3
import App from "./App";
4
5
const container = document.getElementById("root");
6
7
const root = createRoot(container);
8
9
root.render(
10
<StrictMode>
11
<App />
12
</StrictMode>
13
);
14
Advertisement
Answer
Components should start with capital letter .
JavaScript
1
30
30
1
import React from 'react';
2
3
function Greeting() {
4
return (
5
<div>
6
Hello World!
7
</div>
8
);
9
}
10
11
export default Greeting;
12
13
14
15
16
import React from 'react';
17
import Greeting from "./greeting";
18
19
20
function App() {
21
return (
22
<main>
23
React⚛️ + Vite⚡ + Replit🌀
24
<Greeting />
25
</main>
26
);
27
}
28
29
export default App;
30