Level 73
Are you following this?
1 like
Hello,
I start learning React and I'm trying to add it to Laravel.
I don't want to use a starter kit, I want to install it manually to understand how it works.
With VueJS, I have no problem to add it manually, but with React, I don't know what happens.
<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Delicious</title>
@if (file_exists(public_path('build/manifest.json')) || file_exists(public_path('hot')))
@vite(['resources/css/app.css', 'resources/js/app.jsx'])
@endif
@viteReactRefresh
</head>
<body>
<div id="delicious"></div>
</body>
</html>
// app.jsx
import './bootstrap';
import { createRoot } from 'react-dom/client';
import App from '@/App';
createRoot(document.getElementById('delicious')).render(<App />);
// App.jsx
import {
BrowserRouter,
Routes,
Route,
} from 'react-router-dom';
import Home from '@/pages/Home';
export default function App () {
return (
<BrowserRouter>
<Routes>
<Route path="/" element={<Home />} />
</Routes>
</BrowserRouter>
);
};
I get this error.
Home.jsx:3 Uncaught Error: @vitejs/plugin-react can't detect preamble. Something is wrong.
Can you help me ?
Thanks ;).
V
@Tray2 I jsut solved the problem.
I need to have @viteReactRefresh before @vite.
Please or to participate in this conversation.