pjparra / assetic-smarty

Smarty Extension for Assetic
12 stars 11 forks source link

Smarty

Assetic can easily be integrated with Smarty 3 with this Smarty plugin. Just drop this plugin in the Assetic/Extensions/Smarty folder.

First, you have to add Assetic/Extension/Smarty to your Smarty plugins_dir:

$smarty = new Smarty();
// ...
$smarty->plugins_dir[] = 'path/to/Assetic/Extension/Smarty';

A simple usage example:

{assetic 
    assets="style/reset.css,style/common.css,style/other.css" 
    output="css" 
    config_path="config" 
    build_path="style/build" 
    debug=false 
    filters="yui_css,less" 
    asset_url=asset_url}
    <link rel="stylesheet" href="https://github.com/pjparra/assetic-smarty/blob/master/{$asset_url}">
{/assetic}

Here is a list of the possible parameters:

There are 3 external files you need to provide:

config.json:

{
    "yuicompressor_path": "/path/to/yuicompressor.jar",
    "closurejar_path": "/path/to/google_closure/compiler.jar",
    "cssembed_path": "/path/to/...",
    "java_path": "/usr/bin/java"
}

Following your preferences, you can choose one of the 2 other files:

bundles.json allows you to simply tell which files you want to include in a bundle:

{
    "css":
    {
        "main":
        [
            "css/reset.css",
            "css/common.css",
            "css/other.css"
        ]
    }
}

This file would allow you to use the "main" bundle name in the "bundle" parameter rather than just giving the list of file names to the "assets" parameter

dependencies.json is a bit more complicated but allows you to benefit from the AssetReference Assetic's feature. Very useful for JS assets:

{
    "js":
    {
        "references":
        {
            "awesomelib": "js/awesome.lib.js",
            "anotherlib": "js/another.lib.js",
            "somejs": "js/just.some.js.file.js"
        },
        "assets":
        {
            "js/foo.js": ["awesomelib","anotherlib"],
            "js/bar.js": ["somejs"],
            "js/no.dependencies.js": []
        }
    }
}

This allows you to keep track of dependencies between JS files, which can be very handy. Then, you only specify the names of your "useful" JS files in the "assets" parameter. The plugin will take care of including only the necessary dependencies for you, without any duplicates. So if you write "js/foo.js,js/no.dependencies.js" in the assets parameter, the plugin will combine js/awesome.lib.js, js/another.lib.hs, js/foo.js and js/no.dependencies.js into the build.