Vite + React not rendering

Question

i'm having a very confusing issue with vite + react, i initialized a new template via npm create vite@latest but the issue is when i start the dev server after all process it does start at localhost, it does show the html file with title Vite + React, and the root element but doesnt render the jsx files... and is giving me a error SyntaxError: Unexpected token '<' (at main.jsx line 7) any ideas?

Error:

main.jsx:6 Uncaught SyntaxError: Unexpected token '<' (at main.jsx:6:61)

main.jsx:

import React from 'react'
import ReactDOM from 'react-dom/client'
import App from './App'
import './index.css'

ReactDOM.createRoot(document.getElementById('root')).render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
)

score 0 · Answer 1 · answered Jun 26 '23 at 21:34

You can try this I hope you find it useful.

import React from "react";
import ReactDOM from "react-dom/client";
import "./index.css";
import App from "./App";
import reportWebVitals from "./reportWebVitals";

const root = ReactDOM.createRoot(document.getElementById("root"));
root.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>
);

reportWebVitals();

Vite + React not rendering

1 Answers1