jbsnewmedia/asset-composer-bundle

A Symfony bundle to help you manage your assets

1.0.0 2024-08-03 11:16 UTC

This package is auto-updated.

Last update: 2024-10-02 11:54:07 UTC


README

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.

Requirements

  • PHP 8.0 or higher
  • Symfony Framework Bundle 6.0 or higher

Installation

To install AssetComposerBundle, you need to use Composer. Run the following command in your project root:

composer require jbsnewmedia/asset-composer-bundle

Usage

This 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.

Adding Assets example

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-alert

This 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.

File Structure Overview

  • src
    • Controller
      • AssetComposerController.php: Controller to manage asset routes.
    • DependencyInjection
      • AssetComposerExtension.php: Dependency injection configuration.
      • Configuration.php: Configuration settings for the bundle.
    • Resources
      • config
      • routes.yaml: Routing configuration. (moved to config/routes/asset_composer.yaml)
      • services.yaml: Symfony service configuration.
    • Service
      • AssetComposer.php: Core functionality for handling assets.
    • Twig
      • AssetComposerBundle.php: The main bundle class.
  • composer.json Composer configuration file for the bundle.

Autoloading

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-autoload

License

This bundle is licensed under the MIT license. See the LICENSE file for more details.

Developed by Juergen Schwind and other contributors.

Contributing

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.

Contact

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!