assetic Download – Download assetic Quellcodes

assetic

assetic ist ein Asset-Management-Framework für PHP, das vom Winter CMS-Team verwaltet wird.

asseticAssetAssetCollection; use assetic AssetFileAsset; use assetic AssetGlobAsset; $js = new AssetCollection(array( new GlobAsset('/path/to/js/*'), new FileAsset('/path/to/another.js'), )); // the code is merged when the asset is dumped echo $js->dump();">

 <?php

use assetic  Asset  AssetCollection ;
use assetic  Asset  FileAsset ;
use assetic  Asset  GlobAsset ;

$ js = new AssetCollection ( array (
    new GlobAsset ( ' /path/to/js/* ' ),
    new FileAsset ( ' /path/to/another.js ' ),
));

// the code is merged when the asset is dumped
echo $ js -> dump ();

Vermögenswerte

Ein assetic Asset ist etwas mit filterbarem Inhalt, der geladen und gelöscht werden kann. Zu einem Asset gehören auch Metadaten, von denen einige manipuliert werden können und andere unveränderlich sind.

Eigentum	Zugriffsberechtigter	Mutator
Inhalt	getContent	setContent
mtime	getLastModified	n / A
Quellstammverzeichnis	getSourceRoot	n / A
Quellpfad	getSourcePath	n / A
Zielpfad	getTargetPath	setTargetPath

Die Eigenschaft „Zielpfad“ gibt an, wo ein Asset (oder eine Sammlung von Assets) abgelegt werden soll.

Filter

Filter können angewendet werden, um Assets zu manipulieren.

asseticAssetAssetCollection; use assetic AssetFileAsset; use assetic AssetGlobAsset; use assetic FilterLessFilter; use assetic FilterUglifyCssFilter; $css = new AssetCollection(array( new FileAsset('/path/to/src/styles.less', array(new LessFilter())), new GlobAsset('/path/to/css/*'), ), array( new UglifyCssFilter('/path/to/uglifycss'), )); // this will echo CSS compiled by LESS and compressed by uglifycss echo $css->dump();">

 <?php

use assetic  Asset  AssetCollection ;
use assetic  Asset  FileAsset ;
use assetic  Asset  GlobAsset ;
use assetic  Filter  LessFilter ;
use assetic  Filter  UglifyCssFilter ;

$ css = new AssetCollection ( array (
    new FileAsset ( ' /path/to/src/styles.less ' , array ( new LessFilter ())),
    new GlobAsset ( ' /path/to/css/* ' ),
), array (
    new UglifyCssFilter ( ' /path/to/uglifycss ' ),
));

// this will echo CSS compiled by LESS and compressed by uglifycss
echo $ css -> dump ();

Die auf die Sammlung angewendeten Filter werden auf jedes Asset-Blatt übertragen, wenn Sie darüber iterieren.

 <?php

foreach ( $ css as $ leaf ) {
    // each leaf is compressed by uglifycss
    echo $ leaf -> dump ();
}

Der Kern stellt die folgenden Filter im assetic Filter -Namespace bereit:

CoffeeScriptFilter : kompiliert CoffeeScript in Javascript
CssImportFilter : Inlines importierte Stylesheets
CSSMinFilter : minimiert CSS
CssRewriteFilter : Korrigiert relative URLs in CSS-Assets beim Wechsel zu einer neuen URL
GoogleClosureCompilerApiFilter : kompiliert Javascript mithilfe der Google Closure Compiler API
HandlebarsFilter : kompiliert Lenkervorlagen in Javascript
JavaScriptMinifierFilter : minimiert Javascript
JpegoptimFilter : Optimieren Sie Ihre JPEGs
JpegtranFilter : Optimieren Sie Ihre JPEGs
LessFilter : Parst LESS in CSS (unter Verwendung von less.js mit node.js)
LessphpFilter : Parst LESS in CSS (mithilfe von lessphp)
OptiPngFilter : Optimieren Sie Ihre PNGs
PackerFilter : komprimiert Javascript mit dem Packer von Dean Edwards
PhpCssEmbedFilter : bettet Bilddaten in Ihr Stylesheet ein
ReactJsxFilter : kompiliert React JSX in JavaScript
ScssphpFilter : Analysiert SCSS in CSS
SeparatorFilter : Fügt ein Trennzeichen zwischen Assets ein, um Zusammenführungsfehler zu verhindern
StylesheetMinifyFilter : Komprimiert Stylesheet-CSS-Dateien
StylusFilter : Analysiert STYL in CSS
TailwindCssFilter : erstellt ein Tailwind-CSS-Stylesheet mit dem eigenständigen Tailwind-CSS-CLI-Dienstprogramm
TypeScriptFilter : Analysiert TypeScript in Javascript
UglifyCssFilter : minimiert CSS
UglifyJs2Filter : minimiert Javascript
UglifyJs3Filter : minimiert Javascript

Vermögensverwalter

Für die Organisation des Vermögens steht ein Vermögensverwalter zur Verfügung.

asseticAssetManager; use assetic AssetFileAsset; use assetic AssetGlobAsset; $am = new AssetManager(); $am->set('jquery', new FileAsset('/path/to/jquery.js')); $am->set('base_css', new GlobAsset('/path/to/css/*'));">

 <?php

use assetic  AssetManager ;
use assetic  Asset  FileAsset ;
use assetic  Asset  GlobAsset ;

$ am = new AssetManager ();
$ am -> set ( ' jquery ' , new FileAsset ( ' /path/to/jquery.js ' ));
$ am -> set ( ' base_css ' , new GlobAsset ( ' /path/to/css/* ' ));

Der Vermögensverwalter kann auch zur Referenzierung von Vermögenswerten genutzt werden, um Duplikate zu vermeiden.

asseticAssetAssetCollection; use assetic AssetAssetReference; use assetic AssetFileAsset; $am->set('my_plugin', new AssetCollection(array( new AssetReference($am, 'jquery'), new FileAsset('/path/to/jquery.plugin.js'), )));">

 <?php

use assetic  Asset  AssetCollection ;
use assetic  Asset  AssetReference ;
use assetic  Asset  FileAsset ;

$ am -> set ( ' my_plugin ' , new AssetCollection ( array (
    new AssetReference ( $ am , ' jquery ' ),
    new FileAsset ( ' /path/to/jquery.plugin.js ' ),
)));

Filtermanager

Zum Organisieren von Filtern steht außerdem ein Filtermanager zur Verfügung.

asseticFilterManager; use assetic FilterScssFilter; use assetic FilterCssMinFilter; $fm = new FilterManager(); $fm->set('sass', new ScssFilter('/path/to/parser/scss')); $fm->set('cssmin', new CssMinFilter());">

 <?php

use assetic  FilterManager ;
use assetic  Filter  ScssFilter ;
use assetic  Filter  CssMinFilter ;

$ fm = new FilterManager ();
$ fm -> set ( ' sass ' , new ScssFilter ( ' /path/to/parser/scss ' ));
$ fm -> set ( ' cssmin ' , new CssMinFilter ());

Asset-Fabrik

Wenn Sie nicht alle diese Objekte von Hand erstellen möchten, können Sie die Asset Factory verwenden, die Ihnen den Großteil der Arbeit abnimmt.

asseticFactoryAssetFactory; $factory = new AssetFactory('/path/to/asset/directory/'); $factory->setAssetManager($am); $factory->setFilterManager($fm); $factory->setDebug(true); $css = $factory->createAsset(array( '@reset', // load the asset manager's "reset" asset 'css/src/*.scss', // load every scss files from "/path/to/asset/directory/css/src/" ), array( 'scss', // filter through the filter manager's "scss" filter '?cssmin', // don't use this filter in debug mode )); echo $css->dump();">

 <?php

use assetic  Factory  AssetFactory ;

$ factory = new AssetFactory ( ' /path/to/asset/directory/ ' );
$ factory -> setAssetManager ( $ am );
$ factory -> setFilterManager ( $ fm );
$ factory -> setDebug ( true );

$ css = $ factory -> createAsset ( array (
    ' @reset ' ,         // load the asset manager's "reset" asset
    ' css/src/*.scss ' , // load every scss files from "/path/to/asset/directory/css/src/"
), array (
    ' scss ' ,           // filter through the filter manager's "scss" filter
    ' ?cssmin ' ,        // don't use this filter in debug mode
));

echo $ css -> dump ();

Die AssetFactory besteht aus einem Stammverzeichnis, das als Basisverzeichnis für relative Asset-Pfade verwendet wird.

Wenn einem Filternamen ein Fragezeichen vorangestellt wird, wie es hier bei cssmin der Fall ist, wird dieser Filter weggelassen, wenn sich die Factory im Debug-Modus befindet.

Sie können auch Worker in der Factory registrieren und alle von ihr erstellten Assets werden vor der Rückgabe an die Methode process() des Workers übergeben. Ein Beispiel finden Sie unten im Abschnitt „Cache Busting“ .

Speichern von Assets in statischen Dateien

Sie können alle Assets, die ein AssetManager enthält, in Dateien in einem Verzeichnis ablegen. Dies wird sich wahrscheinlich unterhalb des Dokumentstammverzeichnisses Ihres Webservers befinden, sodass die Dateien statisch bereitgestellt werden können.

asseticAssetWriter; $writer = new AssetWriter('/path/to/web'); $writer->writeManagerAssets($am);">

 <?php

use assetic  AssetWriter ;

$ writer = new AssetWriter ( ' /path/to/web ' );
$ writer -> writeManagerAssets ( $ am );

Dabei wird der Zielpfad der Assets genutzt.

Cache-Busting

Wenn Sie Ihre Assets wie gerade beschrieben aus statischen Dateien bereitstellen, können Sie den CacheBustingWorker verwenden, um die Zielpfade für Assets neu zu schreiben. Vor der Dateinamenerweiterung wird eine Kennung eingefügt, die für eine bestimmte Version des Assets eindeutig ist.

Diese Kennung basiert auf der Änderungszeit des Assets und berücksichtigt auch abhängige Assets, wenn die angewendeten Filter dies unterstützen.

asseticFactoryAssetFactory; use assetic FactoryWorkerCacheBustingWorker; $factory = new AssetFactory('/path/to/asset/directory/'); $factory->setAssetManager($am); $factory->setFilterManager($fm); $factory->setDebug(true); $factory->addWorker(new CacheBustingWorker()); $css = $factory->createAsset(array( '@reset', // load the asset manager's "reset" asset 'css/src/*.scss', // load every scss files from "/path/to/asset/directory/css/src/" ), array( 'scss', // filter through the filter manager's "scss" filter '?yui_css', // don't use this filter in debug mode )); echo $css->dump();">

 <?php

use assetic  Factory  AssetFactory ;
use assetic  Factory  Worker  CacheBustingWorker ;

$ factory = new AssetFactory ( ' /path/to/asset/directory/ ' );
$ factory -> setAssetManager ( $ am );
$ factory -> setFilterManager ( $ fm );
$ factory -> setDebug ( true );
$ factory -> addWorker ( new CacheBustingWorker ());

$ css = $ factory -> createAsset ( array (
    ' @reset ' ,         // load the asset manager's "reset" asset
    ' css/src/*.scss ' , // load every scss files from "/path/to/asset/directory/css/src/"
), array (
    ' scss ' ,           // filter through the filter manager's "scss" filter
    ' ?yui_css ' ,       // don't use this filter in debug mode
));

echo $ css -> dump ();

Internes Caching

Um unnötige Arbeit zu vermeiden, steht ein einfacher Caching-Mechanismus zur Verfügung.

asseticAssetAssetCache; use assetic AssetFileAsset; use assetic CacheFilesystemCache; use assetic FilterJavaScriptMinifierFilter; $jsMinifier = new JavaScriptMinifierFilter(); $js = new AssetCache( new FileAsset('/path/to/some.js', array($jsMinifier)), new FilesystemCache('/path/to/cache') ); // the JavaScriptMinifierFilter compressor will only run on the first call $js->dump(); $js->dump(); $js->dump();">

 <?php

use assetic  Asset  AssetCache ;
use assetic  Asset  FileAsset ;
use assetic  Cache  FilesystemCache ;
use assetic  Filter  JavaScriptMinifierFilter ;

$ jsMinifier = new JavaScriptMinifierFilter ();
$ js = new AssetCache (
    new FileAsset ( ' /path/to/some.js ' , array ( $ jsMinifier )),
    new FilesystemCache ( ' /path/to/cache ' )
);

// the JavaScriptMinifierFilter compressor will only run on the first call
$ js -> dump ();
$ js -> dump ();
$ js -> dump ();

Zweig

Um die assetic Twig-Erweiterung verwenden zu können, müssen Sie sie in Ihrer Twig-Umgebung registrieren:

 <?php

$ twig -> addExtension ( new assetic Extension ( $ factory ));

Sobald die Erweiterung installiert ist, stellt sie ein Stylesheet und ein Javascripts-Tag mit einer Syntax bereit, die der der Asset Factory ähnelt:

 {% stylesheets '/path/to/sass/main.sass' filter = 'sass,?yui_css' output = 'css/all.css' %}
    < link href = " {{ asset_url }} " type = " text/css " rel = " stylesheet " />
{% endstylesheets %}

In diesem Beispiel wird ein link auf der Seite gerendert, das eine URL enthält, unter der das gefilterte Asset gefunden werden kann.

Wenn sich die Erweiterung im Debug-Modus befindet, rendert dasselbe Tag mehrere link Elemente, eines für jedes Asset, auf das der css/src/*.sass Glob verweist. Die angegebenen Filter werden weiterhin angewendet, es sei denn, sie sind mit dem ? als optional markiert. Präfix.

Dieses Verhalten kann auch durch das Festlegen eines debug Attributs für das Tag ausgelöst werden:

 {% stylesheets 'css/*' debug = true %} ... {% stylesheets %}

Diese Assets müssen in das Webverzeichnis geschrieben werden, damit diese URLs keine 404-Fehler zurückgeben.

asseticAssetWriter; use assetic ExtensionTwigTwigFormulaLoader; use assetic ExtensionTwigTwigResource; use assetic FactoryLazyAssetManager; $am = new LazyAssetManager($factory); // enable loading assets from twig templates $am->setLoader('twig', new TwigFormulaLoader($twig)); // loop through all your templates foreach ($templates as $template) { $resource = new TwigResource($twigLoader, $template); $am->addResource($resource, 'twig'); } $writer = new AssetWriter('/path/to/web'); $writer->writeManagerAssets($am);">

 <?php

use assetic  AssetWriter ;
use assetic  Extension  Twig  TwigFormulaLoader ;
use assetic  Extension  Twig  TwigResource ;
use assetic  Factory  LazyAssetManager ;

$ am = new LazyAssetManager ( $ factory );

// enable loading assets from twig templates
$ am -> setLoader ( ' twig ' , new TwigFormulaLoader ( $ twig ));

// loop through all your templates
foreach ( $ templates as $ template ) {
    $ resource = new TwigResource ( $ twigLoader , $ template );
    $ am -> addResource ( $ resource , ' twig ' );
}

$ writer = new AssetWriter ( ' /path/to/web ' );
$ writer -> writeManagerAssets ( $ am );