PHP 合併靜態資源 (JS/CSS)：auto_prepend_file 實現自動合併與上線建構流程

核心機制

利用 PHP auto_prepend_file 在每個腳本執行前自動載入合併邏輯，透過 import_static() 彈性引入多個 JS/CSS 檔案並輸出正確 MIME 標頭。

PHP.ini 配置

; 必須：指定預載入檔案
auto_prepend_file = "C:\xampp\htdocs\auto_prepend_file.php"

; 可選：允許 URL include (若引入遠端資源)
allow_url_include = On

auto_prepend_file.php 核心邏輯

<?php
/**
 * 引入靜態資源並合併輸出
 * @param array|string $files 相對路徑陣列或單一路徑
 * @param string $path 當前執行腳本路徑 (__FILE__)
 */
function import_static($files, $path = null) {
    // 保存並切換工作目錄
    $old_dir = getcwd();
    $tmp_dir = isset($path) ? dirname($path) : dirname(__FILE__);
    chdir($tmp_dir);

    // 正規化為陣列
    if (!is_array($files)) {
        $files = [$files];
    }

    // 依第一個檔案副檔名決定 Content-Type
    if (isset($files[0])) {
        $first = $files[0];
        if (stripos($first, '.js') !== false) {
            $header = 'Content-Type: text/javascript';
        } elseif (stripos($first, '.css') !== false) {
            $header = 'Content-Type: text/css';
        }
        if (!ob_get_contents()) { // 避免重複送標頭
            header($header);
        }
    }

    // 載入各檔案
    foreach ($files as $file) {
        require_once($file);
    }

    // 還原工作目錄
    chdir($old_dir);
}
?>

使用方式：建立合併入口檔

<?php
// base.js.php
import_static([
    'a.js',
    'b.js',
    '../c.js',
    '../moduleB/all.js.php' // 也可引入其他 .php 合併檔
], __FILE__);
?>

HTML 引用：

<script type="text/javascript" src="base.js.php"></script>
<link rel="stylesheet" type="text/css" href="base.css.php">

上線建構流程 (Build Process)

1. 靜態化輸出：php base.js.php > base.js (同樣處理 CSS)
2. 刪除 PHP 入口：移除 *.js.php、*.css.php
3. HTML 重寫：將 src="base.js.php" 替換為 src="base.js" (可用 preg_replace 批次處理)

優勢分析

現代化替代方案

• 建構工具：Webpack、Vite、Rollup、esbuild (業界標準，支援 Tree-shaking、Code-splitting、Hash 快取)
• PHP 端整合：Vite PHP 整合包、Laravel Mix、Symfony Webpack Encore
• HTTP/2 + 模組化：現代瀏覽器支援 ES Modules，可減少合併需求

摘自 Rain Man