assetic-php / assetic

Asset Management for PHP
MIT License
93 stars 20 forks source link

Example for symfony 5 or 6 integration? #34

Open rofthedeep opened 2 years ago

rofthedeep commented 2 years ago

Hi!

First, thx for your great work!

At the moment I'm trying to get the package connected to my symfony 5 project. But i'm too stupid to get the twig integration running. Do you know a working example for this where I can have a look at? Best, Tim

LukeTowers commented 2 years ago

Not sure tbh, we use it with @wintercms and we don't use the Twig integration. What sort of issues have you run into so far?

cklm commented 2 years ago

Following config works for me (symfony 5.4):

# services.yaml

app.assetic.factory:
    class: Assetic\Factory\AssetFactory
    arguments:
        - '%kernel.project_dir%/public/assets'
        - '%kernel.debug%'

Assetic\Extension\Twig\AsseticExtension:
    arguments:
        - '@app.assetic.factory'
    tags:
        - 'twig.extension'

Then use twig-tags as documented. Whats missing is a command similar to assetic:dump in sf 3.4, which dumps the files once at deployment.

cklm commented 2 years ago

A symfony-command could look like this (not deeply integrated, but it does the job) - extend it for your needs:

<?php

namespace App\Command;

use Assetic\Factory\AssetFactory;
use Assetic\Filter\CSSMinFilter;
use Assetic\Filter\CssRewriteFilter;
use Assetic\Filter\JavaScriptMinifierFilter;
use Assetic\FilterManager;
use Symfony\Component\Console\Command\Command;
use Symfony\Component\Console\Input\InputInterface;
use Symfony\Component\Console\Output\OutputInterface;

class DumpAssetsCommand extends Command
{
    protected static $defaultName = 'app:dump-assets';
    protected static $defaultDescription = 'Add a short description for your command';

    /** @var string */
    protected $projectDir;

    /** @var bool */
    protected $kernelDebug;

    /** @var AssetFactory|null */
    protected $assetFactory;

    public function __construct(string $projectDir, bool $kernelDebug, string $name = null)
    {
        $this->projectDir = $projectDir;
        $this->kernelDebug = $kernelDebug;
        parent::__construct($name);
    }

    protected function configure(): void
    {
        $this
            ->setDescription(self::$defaultDescription);
    }

    protected function execute(InputInterface $input, OutputInterface $output): int
    {
        $cssFile = $this->buildCssFiles();
        $output->writeln('css-files dumped to '.$cssFile);

        $jsFile = $this->buildJsFiles();
        $output->writeln('js-files dumped to '.$jsFile);

        return Command::SUCCESS;
    }

    protected function getAssetFactory(): AssetFactory
    {
        if ($this->assetFactory === null) {
            $filterManager = new FilterManager();
            $filterManager->set('cssrewrite', new CssRewriteFilter());
            $filterManager->set('cssmin', new CSSMinFilter());
            $filterManager->set('jsmin', new JavaScriptMinifierFilter());

            $this->assetFactory = new AssetFactory($this->projectDir.'/public');
            $this->assetFactory->setDebug($this->kernelDebug);
            $this->assetFactory->setFilterManager($filterManager);
        }

        return $this->assetFactory;
    }

    protected function buildCssFiles(): string
    {
        $css = $this->getAssetFactory()->createAsset([
            'css/bootstrap-night.min.css',
            'css/bootstrap-icons.css',
            'css/tom-select.bootstrap5.min.css',
            'css/sweetalert2.min.css',
            'css/style.css',
        ], [
            'cssrewrite',
            '?cssmin',
        ]);

        $filePath = $this->projectDir.'/public/site.css';
        file_put_contents($filePath, $css->dump());

        return $filePath;
    }

    protected function buildJsFiles(): string
    {
        $js = $this->getAssetFactory()->createAsset([
            'js/bootstrap.bundle.min.js',
            'js/chart.min.js',
            'js/tablesort.min.js',
            'js/tablesort.number.min.js',
            'js/clipboard.min.js',
            'js/tom-select.complete.min.js',
            'js/sweetalert2.min.js',
            'js/script.js',
        ], [
            '?jsmin',
        ]);

        $filePath = $this->projectDir.'/public/site.js';
        file_put_contents($filePath, $js->dump());

        return $filePath;
    }
}