1
1
How to Use Assetic for Asset Management
2
2
=======================================
3
3
4
- Assetic is an asset management library which is packaged with the standard
5
- Symfony2 distribution, it has a bundle to allow it to be easily used
6
- in Symfony2 directly from Twig or PHP templates. It works with assets and
7
- filters. The assets are files such as CSS, JavaScript and images files.
8
- There are various filters that can be applied to these files before they
9
- are served to the browser. This allows a separation between the asset files
10
- stored in the application and the files actually presented to the user.
11
- Without using Assetic or another asset manager you are just directly serving
12
- up the files that are stored in the application:
4
+ Assetic is a powerful asset management library which is packaged with the
5
+ Symfony2 Standard Edition and can be easily used in Symfony2 directly from
6
+ Twig or PHP templates.
7
+
8
+ Assetic combines two major ideas: assets and filters. The assets are files
9
+ such as CSS, JavaScript and images files. The filters are things that can
10
+ be applied to these files before they are served to the browser. This allows
11
+ a separation between the asset files stored in the application and the files
12
+ actually presented to the user.
13
+
14
+ Without Assetic, you just serve the files that are stored in the application
15
+ directly:
13
16
14
17
.. configuration-block ::
15
18
@@ -22,29 +25,45 @@ up the files that are stored in the application:
22
25
<script src =" <?php echo $view['assets']->getUrl('js/script.js') ?>"
23
26
type =" text/javascript" />
24
27
28
+ But * with * Assetic, you can manipulate these assets however you want (or
29
+ load them from anywhere) before serving them . These means you can:
30
+
31
+ * Minify and combine all of your CSS and JS files
32
+
33
+ * Run all (or just some) of your CSS or JS files through some sort of compiler,
34
+ such as LESS , SASS or CoffeeScript
35
+
36
+ * Run image optimizations on your images
37
+
25
38
Assets
26
39
------
27
40
28
41
Using Assetic provides many advantages over directly serving the files.
29
42
The files do not need to be stored where they are served from and can be
30
- drawn from various sources such as within a bundle:
43
+ drawn from various sources such as from within a bundle:
31
44
32
45
.. configuration - block::
33
46
34
47
.. code - block:: html+ jinja
35
48
36
49
{% javascripts ' @AcmeFooBundle/Resources/public/js/*'
37
50
% }
38
- < script src= " {{ asset_url }}" > </script >
51
+ < script type = " text/javascript " src= " {{ asset_url }}" > </script >
39
52
{% endjavascripts %}
40
53
41
54
.. code-block :: html+php
42
55
43
56
<?php foreach ($view['assetic']->javascripts(
44
57
array('@AcmeFooBundle/Resources/public/js/*')) as $url): ?>
45
- <script src="<?php echo $view->escape($url) ?>"></script>
58
+ <script type="text/javascript" src="<?php echo $view->escape($url) ?>"></script>
46
59
<?php endforeach; ?>
47
60
61
+ In this example, all of the files in the ``Resources/public/js/ `` directory
62
+ of the ``AcmeFooBundle `` will be loaded and served from a different location.
63
+ The actual rendered tag might simply look like:
64
+
65
+ <script src="/js/abcd123.js"></script>
66
+
48
67
You can also combine several files into one. This helps to reduce the number
49
68
of HTTP requests which is good for front end performance, as most browsers
50
69
will only process a limited number at a time slowing down page load times.
@@ -73,7 +92,6 @@ but still serve them as a single file:
73
92
<script src="<?php echo $view->escape($url) ?>"></script>
74
93
<?php endforeach; ?>
75
94
76
-
77
95
This does not only apply to your own files you can also use Assetic to
78
96
combine third party assets, such as jQuery with your own into a single file:
79
97
0 commit comments