/ 
Mojolicious-Plugin-AssetPack-0.69
River stage one • 6 direct dependents • 6 total dependents
/ Mojolicious::Plugin::AssetPack::Manual::Cookbook

NAME

Mojolicious::Plugin::AssetPack::Manual::Cookbook - Code snippets

REWRITE ONLINE ASSET

Rewrite URLs

This example contains a preprocessors to expand the url() definitions in a css file downloaded from a CDN:

$app->asset->preprocessors->add(
  css => sub {
    my ($assetpack, $text, $file) = @_;

    if ($file =~ /font.*awesome/) {
      $$text =~ s!url\(["']../([^']+)["']\)!url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/$1)!g;
    }
  },
);

$app->asset("app.css" => "https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css");

Fetch referred assets

This example contains a preprocessors which fetch referred assets and serves them from the local webserver:

use File::Basename "basename";
my $cdn_base_url = "http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.1.0";

$t->app->asset->preprocessors->add(
  css => sub {
    my ($assetpack, $text, $file) = @_;
    my $fetch = sub {
      my $url  = "$cdn_base_url/$1";
      my $path = $assetpack->fetch($url);
      return sprintf "url('%s')", basename $path;
    };

    $$text =~ s!url\('..([^']+)'\)!{ $fetch->() }!ge if $file =~ /awesome/;
  }
);

$t->app->asset("app.css" => "$cdn_base_url/css/font-awesome.css");

ONLINE ASSETS

Font Awesome

$app->asset("app.css" => "https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css");

See also "Rewrite URLs" and http://fortaweso.me/font-awesome/.

Google fonts

$app->asset("app.css" => "http://fonts.googleapis.com/css?family=Lora:400,700,400italic,700italic");

See also http://www.google.com/fonts for a selection of fonts.

jQuery

$app->asset("app.js" => "http://code.jquery.com/jquery-1.11.2.min.js");

See http://api.jquery.com/ for jQuery documentation.

SHIPPING

Remember to minify your assets

AssetPack can create both minified and expanded assets, dependent on the mode. This is important to remember when you want to ship an application, since you might forget to create the production assets while developing.

To makes sure this is done, you can add the code below as a unit test:

use Test::More;
use Mojolicious::Plugin::AssetPack;
Mojolicious::Plugin::AssetPack->test_app("MyApp");
done_testing;

See also "test_app" in Mojolicious::Plugin::AssetPack.

Bundling the assets before shipping to CPAN

You can follow the same "Making your application installable" in Mojolicious::Guides::Cookbook guide, since the assets are stored in your "public" directory.

NEXT

Have a look at the unit tests.

AUTHOR

Jan Henning Thorsen - jhthorsen@cpan.org