Tripomatic\NetteAssetic
A lightweight Assetic integration in Nette Framework., (*1)
Tripomatic\NetteApi integrates Assetic in Nette Framework in a minimalist way that allows using Assetic features without limitations. Configuration is fully compatible with the official Assetic package - no additional unnecessary conventions are introduced. Tripomatic\NetteApi also integrates asset routing for development environments and provides commands for asset dumping during production deployment., (*2)
Installation
Install Tripomatic\NetteAssetic using Composer:, (*3)
$ composer require tripomatic/nette-assetic
Quickstart
Add NetteAssetic extension in your NEON config:, (*4)
extensions:
assetic: Tripomatic\NetteAssetic\DI\AsseticExtension
Configure assets in corresponding extension's section:, (*5)
assetic:
assets:
cssLibs:
files:
- %appDir%/../vendor/bower-assets/bootstrap/dist/css/bootstrap.min.css
- %appDir%/../vendor/bower-assets/bootstrap-select/dist/css/bootstrap-select.min.css
cssDefault:
files:
- %appDir%/../document_root/css/main.css
jsLibs:
files:
- %appDir%/../document_root/bower-assets/jquery/dist/jquery.js
- %appDir%/../document_root/bower-assets/bootstrap/dist/js/bootstrap.js
jsDefault:
files:
- %appDir%/../document_root/js/main.js
Include assets in your Latte template:, (*6)
<link rel="stylesheet" href="{asset cssLibs}">
<link rel="stylesheet" href="{asset cssDefault}">
Configuration
Tripomatic\NetteAssetic provides easy and transparent configuration which is compatible with Assetic's settings., (*7)
Debug mode
Debug mode is set up automatically according to your application's debugMode. This behavior can be overriden:, (*8)
assetic:
debug: TRUE # or FALSE to disable debug mode
Asset routing
In debug mode assets are automatically compiled and served to the ouptut with AssetRoute. This behavior can be overriden:, (*9)
assetic:
route: TRUE # or FALSE to disable asset routing
Filters
Assetic filters are fully supported. At first filters must be registered in a similar way as common services:, (*10)
assetic:
filters:
lessPhp: Assetic\Filter\LessphpFilter
yuiCss: Assetic\Filter\Yui\CssCompressorFilter('/path/to/yuicompressor.jar')
Then they can be assigned to assets:, (*11)
assetic:
assets:
assetName:
files:
- %appDir%/../document_root/css/front.less
- %appDir%/../document_root/css/admin.less
filters:
- lessPhp
- ?yuiCss
Prefixing a filter name with ? cause the filter to be omitted in debug mode., (*12)
Workers
Assetic workers are fully supported. All assets will be passed to the worker's process() method. Typical example is the CacheBustingWorker:, (*13)
assetic:
workers:
- Assetic\Factory\Worker\CacheBustingWorker
Cache
Asset compiling and serving can be computationally expensive. Therefore, assets are cached and recompiled only when changed. By default assets are cached only in-memory with Assetic\Cache\ArrayCache. It's better to use a persistent cache that can keep data between two requests:, (*14)
assetic:
cache: Assetic\Cache\FilesystemCache(%tempDir%/assetic)
For a full list of cache implementations see https://github.com/kriswallsmith/assetic/tree/master/src/Assetic/Cache., (*15)
AssetRoute also automatically handles HTTP caching by using the correct cache-control headers. If an asset has not been modified the client receives HTTP/1.1 304 Not Modified., (*16)
Asset dumping
Although content and HTTP caching mechanisms can significantly speed up asset serving, there is still an overhead of running the application for every asset. Thus in production environments the assets should be dumped to a filesystem or CDN during deploy and served directly by HTTP server or CDN network., (*17)
The easiest option to dump all assets to their target location is using provided Symfony\Console command. NetteAssetic automatically registers the command in DI container so all that has to be done is to register the command to your console application instance:, (*18)
$commands = $container->findByType('Symfony\Component\Console\Command\Command');
foreach ($commands as $commandName) {
$consoleApplication->add($container->getService($commandName));
}
Then the assets can be dumped with (supposing you run the Symfony\Console application from console.php):, (*19)
$ php console.php assetic:dump
Don't forget to add the above line to your deploy scripts., (*20)
List of configuration options
Listed below are all possible configuration options along with some example values:, (*21)
assetic:
root: %wwwDir%
output: assetic/*
debug: %debugMode%
route: TRUE
cache: Assetic\Cache\FilesystemCache(%tempDir%/assetic)
filters:
lessPhp: Assetic\Filter\LessphpFilter
yuiCss: Assetic\Filter\Yui\CssCompressorFilter('/path/to/yuicompressor.jar')
workers:
- Assetic\Factory\Worker\CacheBustingWorker
assets:
assetName:
files:
- %appDir%/../document_root/css/front.less
- %appDir%/../document_root/css/admin.less
filters:
- lessPhp
- ?yuiCss
output: assetic/*
root: %wwwDir%
debug: TRUE
variables: []
FAQ
How do I include Bootstrap fonts or images?
For now you have to list them as assets with fixed output (Assetic itself doesn't have a better option for this):, (*22)
assetic:
assets:
bootstrap_glyphicons_eot: [ files: %appDir%/../vendor/bower-assets/bootstrap/dist/fonts/glyphicons-halflings-regular.eot, output: fonts/glyphicons-halflings-regular.eot ]
bootstrap_glyphicons_svg: [ files: %appDir%/../vendor/bower-assets/bootstrap/dist/fonts/glyphicons-halflings-regular.svg, output: fonts/glyphicons-halflings-regular.svg ]
bootstrap_glyphicons_ttf: [ files: %appDir%/../vendor/bower-assets/bootstrap/dist/fonts/glyphicons-halflings-regular.ttf, output: fonts/glyphicons-halflings-regular.ttf ]
bootstrap_glyphicons_woff: [ files: %appDir%/../vendor/bower-assets/bootstrap/dist/fonts/glyphicons-halflings-regular.woff, output: fonts/glyphicons-halflings-regular.woff ]
bootstrap_glyphicons_woff2: [ files: %appDir%/../vendor/bower-assets/bootstrap/dist/fonts/glyphicons-halflings-regular.woff2, output: fonts/glyphicons-halflings-regular.woff2 ]
License
Tripomatic\NetteAssetic is licensed under MIT., (*23)
Wallogit.com
