/ 
Mojolicious-Plugin-AssetPack-0.3801
River stage one • 6 direct dependents • 6 total dependents
/ Mojolicious::Plugin::AssetPack::Manual::Include

NAME

Mojolicious::Plugin::AssetPack::Manual::Include - How to include assets in the template

DESCRIPTION

This manual will show you various ways to include the assets generated by Mojolicious::Plugin::AssetPack.

Example asset

The description below use the example CSS asset below. The same rules apply to other formats as well, such as JavaScript assets.

app->asset(
  "my-asset.css" => (
    "/css/foo.less",
    "/css/bar.scss",
    "/css/main.css",
  )
);

USAGE

Simple

The simplest way to include an asset is simply by using the asset helper:

%= asset "my-asset.css"

This will result in a single html link tag in production mode, and a list of link tags in development mode.

  • production

    <link rel="stylesheet" href="/packed/my-asset-9bb8a2a996dde4692205a829ba6d1c8a.css">

  • development

    <link rel="stylesheet" href="/packed/foo-9bb8a2a996dde4692205a829ba6d1c8a.css">
<link rel="stylesheet" href="/packed/bar-9bbaa9de620a29a618a8277636acfe33.css">
<link rel="stylesheet" href="/css/main.css">

Inline

AssetPack is able to insert your assets directly into your markup. This is useful if you want to make a one-page app and want to keep the number of requests to the server at a minimum. However, the images, fonts or any other external asset which again is referred to require more requests to the server. See below on how to include the asset directly in your template:

%= asset "app.css", {inline => 1}

The same rules for expansion as for "Simple" apply here, but the the result will be a style tag, or a list of style tags:

<style type="text/stylesheet">
  /* your css here */
</style>

Attributes

You can pass on tag attributes to the generated HTML tag, with a list of arguments at the end:

%= asset "app.css", {}, media => "print,handheld,embossed"

Full control

If you want, it is possible to add the assets manually to the template, using the "get" in Mojolicious::Plugin::AssetPack method:

% for my $asset (asset->get("app.js")) {
  <script src="<%= $asset %>"></script>
% }

AUTHOR

Jan Henning Thorsen - jhthorsen@cpan.org