Basic PHP page
The simplest possible setup: one index.php entry and one JavaScript module.
File structure
my-app/
├── index.php
├── src/
│ ├── main.js
│ └── style.css
└── vite.config.js
vite.config.js
import { defineConfig } from 'vite';
import usePHP from 'vite-plugin-php';
export default defineConfig({
plugins: [usePHP()],
});
index.php
<!-- index.php -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Basic PHP Page</title>
<link rel="stylesheet" href="./src/style.css" />
</head>
<body>
<h1><?php echo 'Rendered by PHP at ' . date('H:i:s'); ?></h1>
<script src="./src/main.js" type="module"></script>
</body>
</html>
src/style.css
body {
font-family: system-ui, sans-serif;
padding: 2rem;
background: #f8fafc;
color: #1e293b;
}
src/main.js
console.log('Hello from Vite and PHP!');
Run it
npx vite
Open http://localhost:5173. The heading shows the current server time, proving PHP executed before the page was served.