Amechan : Asset Manager Essentials Chain
, (*1)
Amechan (means candy drop in Osaka, Japan) is a lightweight pre-processed asset link manager for PHP.
This library has no side effects unlike Assetic, Sprockets Rails or such as, instead it works better with NodeJS tools like Gulp., (*2)
Quick Start
Define named asset which bundles JS or CSS contents:, (*3)
$assetManager = new AssetManager();
$assetManagr->asset('jquery', [
'file' => '/assets/vendor/jquery/dist/jquery.js',
'section' => 'js',
]);
$assetManagr->asset('bootstrap', [
'baseUrl' => '/assets/vendor/bootstrap/dist',
'bundles' => [
[
'files' => ['css/bootstrap.css', 'css/bootstrap-theme.css'],
'section' => 'css',
],
[
'file' => 'js/bootstrap.js',
'section' => 'js',
],
],
'dependency' => 'jquery',
]);
$assetManagr->asset('some-jquery-plugin', [ ... ]);
$assetManagr->asset('and-another-one', [ ... ]);
Prepare asset collection for presentation session before rendering., (*4)
$assets = $assetManagr->newCollection();
In your view file, require assets:, (*5)
layout.php, (*6)
<?php
$assets->add('bootstrap');
?>
<!DOCTYPE html>
<html>
<head>
... layout here
app-view.php, (*7)
<?php
$assets->add('bootstrap');
$assets->add('some-jquery-plugin');
?>
<div id="app-view">
... app html
</div>
Redundant ->add() calls are summarized and they are ordered by its dependencies., (*8)
Then, in head or end of body tags (often included in the layout template):, (*9)
<?php
foreach ($assets->collectUrls('css') as $url) {
echo "<link href="{$url}" rel="stylesheet">\n";
}
?>
</head>
<?php
foreach ($assets->collectUrls('js') as $url) {
echo "<script src="{$url}"></script>\n";
}
?>
</body>
All required assets are collected and expanded there., (*10)
<link href="/assets/vendor/bootstrap/dist/css/bootstrap.css" rel="stylesheet">
<link href="/assets/vendor/bootstrap/dist/css/bootstrap-theme.css" rel="stylesheet">
</head>
<body>
:
:
<script src="/assets/vendor/jquery/dist/jquery.js"></script>
<script src="/assets/vendor/bootstrap/dist/js/bootstrap.js"></script>
<script src="/assets/js/some-jquery-plugin.js"></script>
</body>
Features
- Bundling multi sectioned assets as single unit
- Link order auto detection according to dependency chain
- Source to built URL mapping (any to
*.min.js)
- Revision hash support with
rev-manifest.json format
URLs can be mapped when compiled version assets exist., (*11)
if (is_dir(__DIR__ . '/../public/assets/dist')) {
$assetManager->mapping(new UnifiedResourceMapper('/assets', [
'dist/css/all.min.css' => [
'vendor/bootstrap/dist/css/bootstrap.css',
'vendor/bootstrap/dist/css/bootstrap-theme.css',
],
'dist/js/all.min.js' => [
'vendor/jquery/dist/jquery.js',
'vendor/bootstrap/dist/js/bootstrap.js',
],
]));
}
<link href="/assets/dist/css/all.min.css" rel="stylesheet">
URLs can be replaced to revision hashed version., (*12)
if (is_file(__DIR__ . '/../public/assets/dist/rev-manifest.json')) {
$manifest = json_decode(file_get_contents(
__DIR__ . '/../public/assets/dist/rev-manifest.json'
), true);
$assetManager->mapping(new RevisionHashMapper('/assets/dist/', $manifest));
}
<link href="/assets/dist/css/all-33f4c35457.min.css" rel="stylesheet">
Definition
// TBD (See /example project), (*13)
Wallogit.com
