Assetic Angular Js Bundle Laravel Package

Getting Started

Confirm your stack first: this bundle is only useful on a Symfony 2.x/3.x application that still uses AsseticBundle and AngularJS 1.x. Symfony no longer ships Assetic, so you almost certainly need symfony/assetic-bundle installed alongside this package.

composer require miguel/assetic-angular-js-bundle

Register the bundle in your kernel (app/AppKernel.php on legacy Symfony):

new MiguelGonzalez\AsseticAngularJsBundle\AsseticAngularJsBundle(),

Then enable the filter in app/config/config.yml under assetic.filters. The exact filter key and its options (module name, output wrapping) live in the bundle's DependencyInjection/ extension and Resources/config/ — read those first rather than guessing. You can also discover the registered filter name directly:

php app/console debug:container --tag=assetic.filter

A first working use case — compile every partial in a directory into a single JS file that primes the AngularJS template cache:

{% javascripts
    '@AcmeBundle/Resources/views/partials/*.html'
    filter='angular_template_cache'
    output='js/templates.js' %}
    <script src="{{ asset_url }}"></script>
{% endjavascripts %}

The output is JavaScript that calls $templateCache.put('<key>', '<html>') for each file. Once loaded, templateUrl lookups for those keys resolve synchronously and stop generating HTTP requests.

Implementation Patterns

Directory-per-feature compilation. Point the javascripts tag at a glob, one tag per feature area (e.g. partials/admin/*.html, partials/shop/*.html). This keeps the cache file small per route and avoids rebuilding a giant bundle on every template edit. Combine them into a single output only when you have confirmed the total size is acceptable.

Match the cache key to templateUrl exactly. The filter derives a key from the file path; your templateUrl values (or ui-router state templateUrls) must use the same string character-for-character. If the filter emits keys relative to the bundle root, define a small templateUrl helper in your app that normalizes paths to that same form rather than hard-coding strings in both places.

Filter ordering matters. Apply the Angular template-cache filter before uglifyjs/uglifyjs2, not after. The cache filter produces valid JS around raw HTML strings; running a JS compressor first will mangle the HTML before it is wrapped, and running the cache filter after compression on .html inputs produces nothing useful. Keep the order explicit in the filter argument: filter='angular_template_cache,uglifyjs2'.

Dev vs. prod. In config_dev.yml use assetic.use_controller: true so templates are recompiled on every request while you edit partials. In config_prod.yml use false and run assetic:dump as part of deploy/cache:warmup. Verify the dumped file actually lands under web/js/ and is referenced via asset_url.

Module registration. The generated JS registers on a module (the bundle's configured module name). Ensure that module exists and is loaded before your app bootstraps, or that your app module declares it as a dependency. If you see templates missing at runtime, check this before blaming the filter.

Separate vendor vs. app templates. You rarely want third-party partials in the same cache file; scope globs to your own bundle's partials/ directory.

Gotchas and Tips

• This is legacy maintenance territory. AngularJS reached end-of-life in December 2021 and Assetic was removed from Symfony core. Treat this package as something to read and pin, not something to build new work on. With zero stars and zero dependents, there is effectively no community support — budget time to read the ~few hundred lines of source yourself.
• Audit before adopting. The entire bundle is small. Read the filter class and its service definition; confirm what escaping it applies to quotes, backslashes, and newlines in HTML. Templates containing single quotes or </script>-style strings are the classic source of broken generated JS.
• Escaping and minification conflicts. If your templates include inline <script> or apostrophes in text, test the compiled output in a browser, not just in PHP. Pre-minifying HTML (before the cache filter) can reduce escaping edge cases.
• Key normalization surprises. Leading ./, absolute paths, and Windows/Unix separators can all leak into cache keys. Dump templates.js and grep the put( calls; that is the fastest way to confirm the keys match your templateUrls.
• Cache busting in prod. asset_url handles versioning; a hand-written <script src="/js/templates.js"> will serve stale caches after deploy. Always go through asset_url.
• Watch mode for iteration. php app/console assetic:dump --watch recompiles on change and is far faster to debug than toggling use_controller and refreshing.
• Filter not applying? Check the apply_to pattern (if configured) and that the glob actually matches files — Assetic silently emits an empty file if the glob matches nothing. Compare source and output file counts.
• Extension point. If you need custom behavior (e.g. a different key prefix, or a templateUrl function instead of string keys), implement Assetic's Assetic\Filter\FilterInterface with a small wrapper rather than patching the vendor bundle. This keeps upgrades/removals clean.
• Removal plan. If this is an inherited codebase, the migration path is a modern bundler (Webpack/Vite) plus an angular-templatecache-style plugin, or replacing templateUrl with inline template: strings. Either eliminates the Assetic dependency entirely.