=encoding utf8
=head1 NAME
Mojolicious::Plugin::AssetPack::Manual::Include - How to include assets in the template
=head1 DESCRIPTION
This manual will show you various ways to include the assets generated
by L<Mojolicious::Plugin::AssetPack>.
=head2 Example asset
The description below uses the following example CSS asset. 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",
)
);
=head1 USAGE
Here are some ways to use L<Mojolicious::Plugin::AssetPack>.
=head2 Simple
The simplest way to include an asset is simply by using the
L<asset|Mojolicious::Plugin::AssetPack/asset> helper:
%= asset "my-asset.css"
This will result in a list of C<link> tags in development mode and a single html
C<link> tag in production mode.
=over 4
=item * production
<link rel="stylesheet" href="/packed/my-asset-9bb8a2a996dde4692205a829ba6d1c8a.css">
=item * development
<link rel="stylesheet" href="/packed/foo-9bb8a2a996dde4692205a829ba6d1c8a.css">
<link rel="stylesheet" href="/packed/bar-9bbaa9de620a29a618a8277636acfe33.css">
<link rel="stylesheet" href="/css/main.css">
=back
=head2 Inline
L<AssetPack|Mojolicious::Plugin::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 L</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>
=head2 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"
=head2 Full control
If you want, it is possible to add the assets manually to the template,
using the L<Mojolicious::Plugin::AssetPack/get> method:
% for my $asset (asset->get("app.js")) {
<script src="<%= $asset %>"></script>
% }
=head1 AUTHOR
Jan Henning Thorsen - C<jhthorsen@cpan.org>
=cut