Vite部署Hostinger失败解决指南

Vite 无法在 Hostinger 共享主机上直接运行开发服务器（`npm run dev`），因其环境不支持长期运行的 Node.js 进程且无 SSH 权限；正确做法是本地执行 `npm run build` 生成带哈希的静态资源和 `manifest.json`，再将整个 `public/` 目录内容（而非文件夹本身）上传至 Hostinger 的网站根目录（如 `public_html/`），确保 Laravel 的 `@vite` 指令能准确解析并注入构建后的资源——这是唯一稳定、安全且符合官方规范的部署路径，帮你绕过环境限制，让现代前端工具链在传统托管平台高效落地。

Hostinger 不支持直接运行 Vite 开发服务器（npm run dev），需通过构建生产版本（npm run build）生成静态资源并正确部署 public/ 目录，确保 Laravel 的 @vite 指令能正常读取 manifest.json。

Hostinger 不支持直接运行 Vite 开发服务器（`npm run dev`）；需通过构建生产版本（`npm run build`）生成静态资源并正确部署 `public/` 目录，确保 Laravel 的 `@vite` 指令能正常读取 `manifest.json`。

Vite 是一个现代前端构建工具，但它本身不是一个可托管的运行时服务——它不提供长期运行的 HTTP 服务器（如 Node.js 后端），而是一个开发时热更新服务 + 构建时静态资源生成器。Hostinger 的共享主机环境（包括其“WordPress Hosting”或“Linux Shared Hosting”套餐）仅支持纯静态文件或 PHP 应用（如 Laravel），且不开放 SSH 或自定义进程管理权限，因此你无法在 Hostinger 上持续运行 npm run dev 或 vite 命令。

✅ 正确做法是：使用 Vite 构建生产包，将生成的静态资源集成进 Laravel，并完整部署 public/ 目录。

1. 确保 Vite 配置兼容 Laravel

Laravel 默认已集成 Vite 支持（≥ v9.19）。检查 vite.config.js 是否包含 Laravel 插件配置：

import { defineConfig } from 'vite';
import laravel from 'laravel-vite-plugin';

export default defineConfig({
  plugins: [
    laravel({
      input: ['resources/css/app.css', 'resources/js/app.js'],
      refresh: true,
    }),
  ],
});

该配置会确保构建后生成 public/build/manifest.json 和带哈希的资源文件（如 build/assets/app-abc123.js）。

2. 执行生产构建（关键步骤）

在本地项目根目录运行：

npm run build
# 或
yarn build
# 或（若使用 pnpm）
pnpm build

✅ 此命令会：

• 编译并压缩所有 JS/CSS；
• 生成带内容哈希的文件名（防缓存）；
• 输出 public/build/ 目录及 public/build/manifest.json（Laravel 依赖此文件解析资源路径）。

⚠️ 注意：不要上传 node_modules/、src/、resources/ 等源码目录 —— Hostinger 只需要 public/（含 index.php）和 .env（若需）。

3. 部署到 Hostinger 的正确方式

• 使用 FTP / File Manager 上传整个 public/ 目录内容（非 public 文件夹本身）到 Hostinger 的网站根目录（通常是 public_html/ 或子域名对应目录）；
• 确保 public_html/index.php 存在且为 Laravel 入口；
• 确保 public_html/build/ 目录完整存在，且内含 manifest.json 和 assets/ 子目录；
• 若使用 .env，请手动配置数据库、APP_KEY 等（Hostinger 控制台可能提供环境变量设置入口，但更推荐直接编辑 .env 并设为 644 权限）。

4. 验证 @vite 是否生效

在 Laravel Blade 模板中（如 resources/views/app.blade.php），应使用标准指令：

@vite(['resources/css/app.css', 'resources/js/app.js'])

Laravel 运行时会自动读取 public/build/manifest.json，将其映射为带哈希的