The London Perl and Raku Workshop takes place on 26th Oct 2024. If your company depends on Perl, please consider sponsoring and/or attending.

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 "not minified" assets. This is important to remember when you want to ship an application, since you might forget to create the production/minified assets while developing.

To makes sure this is done, you can add a unit test that looks pretty much like this:

  use Mojo::Base -strict;
  use Test::Mojo;

  plan skip => "This should be an ./xt test" unless -d ".git";

  for my $mode (qw( development production )) {
    local $ENV{MOJO_MODE} = $mode;
    Test::Mojo->new("YourAwesomeMojoApp")->get_ok("/");
  }

  done_testing;

Note that the test above will only work if you are not manually specifying "minify" 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