Componette

Componette

Machy8

Machy8 / webloader v2.0.1

📦 Simple, easy to use, php bundler for javascript and css.

download-cloud-line composer require machy8/webloader

📦 Simple, easy to use, php bundler for javascript and css.

In a nutshell

  • Configurable: in one file (example bellow or in docs)
  • Files collections and containers: makes assets organizing incredibly simple
  • Filters: callable in two different ways
  • Path placeholders: reusable paths to files, less writing
  • Allows you to load remote and local files
  • If you have some critical css, you can load it directly into the page with minimal configuration required
  • Prepared for read only deployment - webloader is able to compile all files collections at once
  • Debugger bar for Tracy

Requirements

  • PHP 8.0+
  • If you use Nette Framework - v2.4+

Installation

 composer require machy8/webloader

Docs

Quick start

Let's say we have two css files (styla-a.css and style-b.css) and we want to bundle them into one file which name will be my-bundle. This bundle will be stored in a webtemp dir (must be accessible from a browser).

The recommended way to configure Web Loader is through neon configuration files. The first step is to create a bundle.neon.

my-bundle:
    cssFiles:
        - path/to/style-a.css
        - path/to/style-b.css

Next step is to init Web Loader, set the output dir path and tell him to create bundles from bundle.neon.

$webloader = new \WebLoader\Engine('path/to/webtemp');
$webloader->createFilesCollectionsFromConfig('path/to/bundle.neon');

The last step is to call files collections render to render css files collection named my-bundle.

echo $webloader->getFilesCollectionRender()->css('my-bundle');

The PHP file after the last edit will looks like this:

$webloader = new \WebLoader\Engine('path/to/output/dir');
$webloader->createFilesCollectionsFromConfig('path/to/bundle.neon');

echo $webloader->getFilesCollectionRender()->css('my-bundle');

The output will be similiar to the following code:

<link type="text/css" rel="stylesheet" href="/path/to/webtemp/my-bundle.css?v=1512829634">

Quick start (for Nette Framework)

For the Nette Framework it is very similar. First of all, register Web Loader extension.

extensions:
    webloader: WebLoader\Bridges\Nette\WebLoaderExtension

Next step is to add Web Loader section with my-bundle collection configuration inside.

webloader:
    filesCollections:
        my-bundle:
            cssFiles:
                - path/to/style-a.css
                - path/to/style-b.css

In your presenter, inject the engine...

/**
 * @var Engine
 */
private $webLoader;


public function __construct(\WebLoader\Engine $engine)
{
    $this->webLoader = $engine;
}

and set template parameters (for example in the beforeRender method).

public function beforeRender()
{
    $this->template->webloaderFilesCollectionRender = $this->webLoader->getFilesCollectionRender();
}

The last step is to call the render in a latte template.

{$webloaderFilesCollectionRender->css('my-bundle')|noescape}
  • v2.0.1 2.0.1

    Remove type="text/css" and text="text/javascript" from link, script and style tags as it triggers warning in the HTML validator.

  • v2.0.0 2.0.0

    Updates necessary for PHP 8

  • v1.3.1 1.3.1

    • Added publicPathPrefix option for custom paths like domains to file urls
    • Added playground
  • v1.3.0 1.3.0

    • Removed support for Nette <= 2.3
    • Added support for Nette 2.4 and 3.0
  • v1.2.1 1.2.1

    Allow nette/neon 3.0

  • v1.2.0 1.2.0

    • This version requires PHP >= 7.1

    Closes

    • #2 - Remote files loading,
    • #6 - Add PhpStan,
    • #7 - Add coding standard

    Compiler

    • Removed deprecated methods - addCssFilter, addJsFilter, compileCssFilesCollection, compileJsFilesCollection, createCssFilesCollection, createJsFilesCollection
    • Added method for setting remote files loading timeout
  • v1.1.2 1.1.2

    • Fixed issue with documentRoot '/' path, when server uses open_basedir restrictions #5
  • v1.1.1 1.1.1

    • Updated readme
    • Fixed license in composer.json
    • Prefix for naming loaded files is now not persistent and is reset after element is rendered.
  • v1.1.0 1.1.0

    • #4 - added breakpoints filter
    • Deprecated methods in compiler class (there will be exception thrown in next version):
      • addCssFilter, addJsFilter => use addFilter instead
      • compileCssFilesCollection, compileJsFilesCollection => use compileFilesCollection
      • createCssFilesCollection, createJsFilesCollection => use createFilesCollection
    • Type parameter is now always the first parameter for methods
    • Is possible to add prefix before generated or loaded file in render method
  • v1.0.2 1.0.2

    • Fixed #3
  • v1.0.1 1.0.1

    Fixes preg_replace error #1

  • v1.0.0 1.0.0

    Initial release

bar-chart-fill

Statistics

download-cloud-fill
26011
star-fill
19
bug-fill
3
flashlight-fill
2.3y
price-tag-2-line

Badges

guide-fill

Dependencies

php (>=7.1)
nette/neon (^2.4|^3.0)
Componette Componette felix@nette.org