PHPackages                             dakota/asset - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. dakota/asset

ActiveCakephp-plugin

dakota/asset
============

Asset management plugin for CakePHP

v2.0.0(12y ago)1206PHPPHP >=5.2.0

Since Nov 14Pushed 12y agoCompare

[ Source](https://github.com/dakota/CakePHP-Asset-Management-Plugin)[ Packagist](https://packagist.org/packages/dakota/asset)[ RSS](/packages/dakota-asset/feed)WikiDiscussions master Synced 1mo ago

READMEChangelogDependencies (1)Versions (2)Used By (0)

Asset Plugin
============

[](#asset-plugin)

Dealing with javascript files and css files is easy. You just include all your stylesheets and scripts on every page. However, with all these mobile devices accessing your app we must make an effort to reduce loading time. Non-mobile users will also appreciate efforts to optimize frontend performance of your app, as it's in most cases a far more serious bottleneck than the performance of your backend (php, mysql, etc).

The Asset plugin does exactly that for you - it combines and minifies scripts and stylesheets and makes sure, that only the assets needed for a specific view are loaded. It also supports preprocessors like LESS, Coffeescript and Kaffeine. Here is the full feature set:

Features
--------

[](#features)

- Combining js files and css files.
- Minification of combined files with support for different algorithmns (uglifyjs, jsmin, closure compiler and cssmin). There is an easy way to add your own algorithmns as well.
- Ability to specify which assets should be loaded for a given Controller::action pair. This ensures you only load the files that you really need on the page.
- Support for preprocessors like LESSCSS with support for prepending a file to the package that contains variables and less mixins. For javascript there is support for CoffeeScript and Kaffeine.
- Automatic detection and conversion for image paths in stylesheets.
- Combining and minification of files is optional, so that you can load the proper files in development mode to keep error messages pointing to the correct files and lines.
- Support for javascript internationalisation using the \_\_('some text to translate') syntax
- Automagic including of files that belong to your controller action or layout. For example if you access /posts/edit/2 the plugin will try to load the stylesheet /app/webroot/css/views/posts/edit.less and the script /app/webroot/js/views/posts/edit.js.

It will also load /app/webroot/css/views/layouts/default.less and /app/webroot/js/views/layouts/default.js or whatever layout has been set in your PostsController.
You can also configure these auto-include paths to your liking.

- A shell to prebuild all packaged asset files for all Controller::action pairs on deployment -> This is optional, as in most cases the conversion can be done on the fly as it's really fast -> This builds packaged files or all languages (think of javascript i18n) and all layouts (think of the auto include paths)
- Handles external stylesheets and scripts gracefully, by not including them into packaged files.
- Only rebuilds packaged files if any of the stylesheets or scripts included in them changed.

Requirements & Installation
-------------------------------

[](#requirements--installation)

The plugin has been designed to work with CakePHP 1.3.7 stable, but it also works with 1.2.x.

In case you intend to use LESSCSS, you require Nodejs version 0.2.2 or later. Likewise for Coffeescript, Kaffeine and Uglifyjs.

1. Move the plugin to /app/plugins or wherever your plugins reside.
2. Create the folders /app/webroot/css/aggregate and /app/webroot/js/aggregate, chmod them to 644 and and then add the execute flag to directories recursively. Make sure to chown them to www-data.www-data:

```
  chmod -R 644 /path/to/project/app/webroot/js/aggregate
  chmod -R +X /path/to/project/app/webroot/js/aggregate
  chown www-data.www-data /path/to/project/app/webroot/js/aggregate

```

.. and likewise for /css/aggregate.

Make sure to create these folders for all environments (production, staging, etc).

If you use Git, it's a good idea to add an "empty" file to each folder and just add that file to the repository while the the directories themselves are added to your .gitignore file. This makes sure all environments get the folders, but the contents are not in your git repository.

3. Add Configure::write('Assets.packaging', true) to your core.php file. Set it to false if you don't want packaged and minified files. It's a good idea to keep this to true for production environments and to false for everything else.
4. Create the files /app/config/css\_includes.php and /app/config/js\_includes.php and add the following 2 lines in your /app/config/bootstrap.php file:

    Configure::load('css\_includes'); Configure::load('js\_includes');
5. Now open the css\_includes.php file and add all css (or less) files that you want to load for specific controllers/action pairs:

Example:

```

```

Do this likewise for javascript files in your js\_includes.php file:

```

```

6. Create the files /app/views/elements/css\_includes.ctp and /app/views/elements/js\_includes.ctp and fill them with the following contents:

css\_includes.ctp:

```