A Symfony bundle to help you manage your assets directly from the vendor directory, ensuring all files are always up-to-date using their filetime version.
- PHP 8.0 or higher
- Symfony Framework Bundle 6.0 or higher
To install AssetComposerBundle, you need to use Composer. Run the following command in your project root:
composer require jbsnewmedia/asset-composer-bundleThis bundle allows you to include assets from the vendor directory in your Symfony project. It ensures that all files are always current by using their last modified time as a version number. This way, you can be sure that the assets are always up-to-date, even if you update your dependencies.
To add assets from the vendor directory to your project, simply use Composer to manage your dependencies. This method ensures that all assets are always up-to-date, as Composer will handle the downloading and updating of the required packages for you. Here’s how you can include assets in your Symfony project:
Install the asset packages via Composer:
For example, to include Bootstrap, FontAwesome, and AvalynxAlert in your project, run the following commands:
composer require twbs/bootstrap
composer require components/font-awesome
composer require avalynx/avalynx-alertThis will download the asset packages into the vendor directory of your Symfony project.
Include assets in your twig templates:
Once the assets are installed, you can include them in your twig templates using the addAssetComposer function. This function registers the assets for inclusion in the HTML output. Here is an example of how to use it in your base template:
{% extends 'base.html.twig' %}
{% do addAssetComposer('twbs/bootstrap/dist/css/bootstrap.css') %}
{% do addAssetComposer('components/font-awesome/css/all.css') %}
{% do addAssetComposer('avalynx/avalynx-alert/dist/css/avalynx-alert.css') %}
{% do addAssetComposer('avalynx/avalynx-alert/dist/js/avalynx-alert.js') %}In the example above, the CSS and JS files from the specified packages are added to the asset pipeline, ensuring they are included in the final HTML output.
Render the assets:
Finally, you need to render the stylesheets and javaScripts in your HTML. This can be done using the renderAssetComposerStylesheets and renderAssetComposerJavascripts functions. Here’s how to include them in your HTML structure:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>{% block title %}Welcome!{% endblock %}</title>
<link rel="icon" href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 128 128%22><text y=%221.2em%22 font-size=%2296%22>⚫️</text><text y=%221.3em%22 x=%220.2em%22 font-size=%2276%22 fill=%22%23fff%22>sf</text></svg>">
{% block stylesheets %}
{{ renderAssetComposerStylesheets() }}
{% endblock %}
{% block javascripts %}
{{ renderAssetComposerJavascripts() }}
{% endblock %}
</head>
<body>
{% block body %}{% endblock %}
{{ renderAssetComposerJavascripts('bottom') }}
</body>
</html>By following these steps, you can seamlessly manage and include assets from the vendor directory in your Symfony project, ensuring they are always up-to-date.
- config
routes.yaml: Routing configuration. (moved toconfig/routes/asset_composer.yaml)services.yaml: Symfony service configuration.
- src
- Controller
AssetComposerController.php: Controller to manage asset routes.
- DependencyInjection
AssetComposerExtension.php: Dependency injection configuration.Configuration.php: Configuration settings for the bundle.
- Service
AssetComposer.php: Core functionality for handling assets.
- Twig
AssetComposerBundle.php: The main bundle class.
- Controller
composer.jsonComposer configuration file for the bundle.
The bundle uses PSR-4 autoloading, as defined in composer.json:
"autoload": {
"psr-4": {
"JBSNewMedia\\AssetComposerBundle\\": "src/"
}
}Ensure your application's autoloader is updated by running:
composer dump-autoloadThe assetcomposer.json file allows you to specify which files should be included in the project. Using the files and files-dev keys, you can define which files are allowed to be loaded in the production and development environments, respectively. This JSON file can be included by other libraries and tools to ensure that only the desired assets are used.
The assetcomposer.json file should be placed in the root directory of the library or tool, where the composer.json file is also located, and it should have the following structure:
{
"name": "Library name",
"files": [
"dist/css/library.css",
"dist/js/library.js"
],
"files-dev": [
"src/css/library.css",
"src/js/library.js"
]
}This bundle is licensed under the MIT license. See the LICENSE file for more details.
Developed by Juergen Schwind and other contributors.
Contributions are welcome! If you'd like to contribute, please fork the repository and submit a pull request with your changes or improvements. We're looking for contributions in the following areas:
- Bug fixes
- Feature enhancements
- Documentation improvements
Before submitting your pull request, please ensure your changes are well-documented and follow the existing coding style of the project.
If you have any questions, feature requests, or issues, please open an issue on our GitHub repository or submit a pull request.
We'd love to hear from you!