vite 默认仅支持 index.html 作为 html 入口，但通过 vite-plugin-php 插件，可无缝将 index.php 设为入口，无需修改构建逻辑或手动处理 php 渲染。
vite 默认仅支持 index.html 作为 html 入口，但通过 vite-plugin-php 插件，可无缝将 index.php 设为入口，无需修改构建逻辑或手动处理 php 渲染。
Vite 的设计初衷是面向现代前端构建，因此默认仅识别并处理 index.html 作为 HTML 入口文件。当你从 Create React App 迁移至 Vite，且原有项目依赖 index.php（例如用于服务端配置、环境变量注入、用户身份验证或动态 meta 标签生成），直接替换为 index.html 往往不可行。
幸运的是，社区已提供成熟解决方案：vite-plugin-php。该插件在开发服务器和构建流程中透明地支持 .php 入口文件，保留 PHP 的服务端执行能力，同时兼容 Vite 的 HMR、ESM 模块解析与构建优化。
✅ 快速接入步骤如下：
-
安装插件：
npm install vite-plugin-php --save-dev # 或 yarn add vite-plugin-php --dev
-
在
vite.config.ts（或.js）中启用：import { defineConfig } from 'vite'; import react from '@vitejs/plugin-react'; import php from 'vite-plugin-php';
export default defineConfig({ plugins: [ react(), php({ // 可选：指定入口 PHP 文件路径（默认为 './index.php'） entryPoint: './index.php', // 可选：是否在 dev server 中启用 PHP 解析（需本地安装 PHP CLI） enable: true, }) ], });
3. 确保项目根目录下存在 `index.php`，内容示例：
```php
<meta charset="UTF-8"><title>My React App</title><?php if (isset($_ENV['APP_ENV'])): ?><meta name="app-env" content="<?= htmlspecialchars($_ENV['APP_ENV']) ?>"><?php endif; ?><div id="root"></div>
<!-- Vite 注入的脚本标签会自动插入此处 -->
⚠️ 注意事项：
- 开发阶段需确保系统已安装 PHP CLI（
php -v可执行），插件依赖其解析 PHP 代码； - 构建产物仍为静态文件（HTML/JS/CSS），
index.php仅在开发时被解析；生产部署时，需由真实 PHP Web 服务器（如 Apache/Nginx + PHP-FPM）托管index.php，Vite 构建输出的dist/目录应作为 Web 根目录； - 不建议在
index.php中执行耗时逻辑（如数据库查询），以免影响首屏加载性能； - 若使用 TypeScript，插件本身不校验 PHP 类型，PHP 部分请自行保障健壮性。
? 总结：vite-plugin-php 提供了轻量、标准、无侵入的集成方式，让 Vite 项目既能享受现代前端开发体验，又不牺牲 PHP 所带来的服务端灵活性——真正实现「前端现代化」与「后端可控性」的协同演进。
php免费学习视频：立即使用
踏上前端学习之旅，开启通往精通之路！从前端基础到项目实战，循序渐进，一步一个脚印，迈向巅峰！
