README

这是一个适用于Slim 3.x/ Slim 4.x的简单Twig资产扩展，用于帮助管理Twig模板组件中的资源。当您想要更改公开资源时，使用传统方式，必须逐个更改每个模板中的URL资源。使用TwigAsset，您无需担心这一点，只需简单更改所有资源到新的URL。此外，它还能帮助您防止浏览器缓存资源，通过在资源URL末尾设置后缀，所有这些操作都是自动化的。并且它还能做更多。

安装

通过Composer

$ composer require glazilla/twig-asset

需要Slim Framework 3.x | 4.x和PHP 7.0.0或更高版本。

使用方法

设置

在PHP中

// Create Slim app
$app = new \Slim\App();

// Fetch DI Container
$container = $app->getContainer();

// Register Twig View helper
$container['view'] = function ($c) {
    $view = new \Slim\Views\Twig('path/to/templates');

    // Instantiate and add Slim specific extension
    $router = $c->get('router');
    $uri = \Slim\Http\Uri::createFromEnvironment(new \Slim\Http\Environment($_SERVER));
    $view->addExtension(new \Slim\Views\TwigExtension($router, $uri));

    $assetManager = new Glazilla\TwigAsset\TwigAssetManagement([
        'verion' => '1'
    ]);
    $assetManager->addPath('css', '/css');
    $assetManager->addPath('img', '/images');
    $assetManager->addPath('js', '/js');
    $view->addExtension($assetManager->getAssetExtension());

    return $view;
};

// Define named route
$app->get('/home', function ($request, $response, $args) {
    return $this->view->render($response, 'home.html');
});

// Run app
$app->run();

在home.html中

在本版本中，TwigAsset只为您的Twig模板提供一个函数

- `asset(path, namespace)` - returns the real URL resource from your `path`.
    - path - your static `path`.
    - namespace - group the resource to only one name, the url will be shorted.

<!DOCTYPE html>
<html>
<head>
    <!-- absolute path -->
    <!-- result: href="/path/to/css1.css?v=1" -->
    <link rel="stylesheet" type="text/css" href="{{ asset('/path/to/css1.css') }}">

    <!-- relative path with prefix -->
    <!-- result: href="/css/path/to/css2.css?v=1" -->
    <link rel="stylesheet" type="text/css" href="{{ asset('path/to/css3.css', 'css') }}">
</head>
<body>
    <div>
        <!-- absolute path -->
        <!-- result: href="/path/to/images.png?v=1" -->
        <img src="{{ asset('/path/to/images.png') }}">

        <!-- relative path with prefix -->
        <!-- result: href="/images/path/to/images.jpg?v=1" -->
        <img src="{{ asset('path/to/images.jpg', 'img') }}">
    </div>
</body>

<!-- absolute path -->
<!-- result: href="/path/to/js2.js?v=1" -->
<script type="text/javascript" src="{{ asset('/path/to/js1.js') }}"></script>

<!-- relative path with prefix -->
<!-- result: href="js/path/to/js2.js?v=1" -->
<script type="text/javascript" src="{{ asset('path/to/js2.js', 'js') }}"></script>
</html>

示例设置

示例 1

$settings = [
    'version' => '1', // version will be setting in the end of asset url `css.css?(version_format here)`
    'version_format' => '%s?v=%s',
];

// in the html if you call asset('/image.png')
// the result: /v1/image.png?v=1

示例 2

$settings = [
    'version' => 'v1',
    'version_format' => '%2$s/%1$s',
];

// in the html if you call asset('/image.png')
// the result: /v1/image.png

示例 3

// rev-manifest.json
{
    "css/app.css": "build/css/app.b916426ea1d10021f3f17ce8031f93c2.css",
    "js/app.js": "build/js/app.13630905267b809161e71d0f8a0c017b.js",
    "...": "..."
}

$settings = [
    'json_manifest' => __DIR__.'/rev-manifest.json'
];

// in the html if you call asset('css/app.css')
// the result: css/app.b916426ea1d10021f3f17ce8031f93c2.css

许可协议

MIT许可协议（MIT）。请参阅许可文件以获取更多信息。

glazilla / twig-asset

维护者

详细信息

README

安装

使用方法

设置

示例设置

许可协议