README

📦 简单、易用，适用于 JavaScript 和 CSS 的 PHP 打包器。

简要说明

• 可配置：在一个文件中（如下面的示例或文档中）
• 文件 集合 和 容器：使资产组织变得非常简单
• 过滤器：可按两种不同的方式调用
• 路径占位符：可重复使用的文件路径，减少书写
• 允许您加载 远程 和 本地 文件
• 如果您有一些关键的 CSS，可以直接将其加载到页面中，配置要求最小
• 为只读部署准备 - webloader 能够一次性编译所有文件集合
• 调试栏，适用于 Tracy

要求

• PHP 8.0+
• 如果您使用 Nette 框架 - v2.4+

安装

 composer require machy8/webloader

文档

• 文件集合
• 文件集合容器
• 过滤器
• 占位符
• Tracy 桥接器

快速入门

假设我们有两个 CSS 文件（styla-a.css 和 style-b.css），我们希望将它们打包到一个文件中，该文件名为 my-bundle。此捆绑包将存储在 webtemp 目录 中（必须可以从浏览器访问）。

配置 Web Loader 的推荐方法是使用 neon 配置文件。第一步是创建一个 bundle.neon。

my-bundle:
    cssFiles:
        - path/to/style-a.css
        - path/to/style-b.css

下一步是初始化 Web Loader，设置输出目录路径，并告诉它从 bundle.neon 创建捆绑包。

$webloader = new \WebLoader\Engine('path/to/webtemp');
$webloader->createFilesCollectionsFromConfig('path/to/bundle.neon');

最后一步是调用文件集合渲染，以渲染名为 my-bundle 的 CSS 文件集合。

echo $webloader->getFilesCollectionRender()->css('my-bundle');

最后一次编辑后的 PHP 文件将看起来像这样

$webloader = new \WebLoader\Engine('path/to/output/dir');
$webloader->createFilesCollectionsFromConfig('path/to/bundle.neon');

echo $webloader->getFilesCollectionRender()->css('my-bundle');

输出将类似于以下代码

<link type="text/css" rel="stylesheet" href="/path/to/webtemp/my-bundle.css?v=1512829634">

快速入门（对于 Nette 框架）

对于 Nette 框架，非常相似。首先，注册 Web Loader 扩展。

extensions:
    webloader: WebLoader\Bridges\Nette\WebLoaderExtension

下一步是在 my-bundle 集合配置内部添加 Web Loader 部分。

webloader:
    filesCollections:
        my-bundle:
            cssFiles:
                - path/to/style-a.css
                - path/to/style-b.css

在您的表示者中注入引擎...

/**
 * @var Engine
 */
private $webLoader;


public function __construct(\WebLoader\Engine $engine)
{
    $this->webLoader = $engine;
}

并设置模板参数（例如在 beforeRender 方法中）。

public function beforeRender()
{
    $this->template->webloaderFilesCollectionRender = $this->webLoader->getFilesCollectionRender();
}

最后一步是在 latte 模板中调用渲染。

{$webloaderFilesCollectionRender->css('my-bundle')|noescape}