PHPackages                             hostnet/asset-lib - PHPackages - PHPackages  [Skip to content](#main-content)[PHPackages](/)[Directory](/)[Categories](/categories)[Trending](/trending)[Leaderboard](/leaderboard)[Changelog](/changelog)[Analyze](/analyze)[Collections](/collections)[Log in](/login)[Sign up](/register)

1. [Directory](/)
2. /
3. [Utility & Helpers](/categories/utility)
4. /
5. hostnet/asset-lib

AbandonedArchivedHostnet-lib[Utility & Helpers](/categories/utility)

hostnet/asset-lib
=================

Tool for finding all dependencies given a set of input files.

2.0.1(4y ago)162.0k11[2 issues](https://github.com/hostnet/asset-lib/issues)1MITPHPPHP >=7.3

Since Nov 30Pushed 2y ago2 watchersCompare

[ Source](https://github.com/hostnet/asset-lib)[ Packagist](https://packagist.org/packages/hostnet/asset-lib)[ RSS](/packages/hostnet-asset-lib/feed)WikiDiscussions master Synced 3w ago

READMEChangelog (10)Dependencies (9)Versions (44)Used By (1)

**Note:** Due to the fast changing ecosystem and better javascript support in popular frameworks, this lib has been deprecated with no direct alternative.

---

[ ![](https://camo.githubusercontent.com/6a25649d6782916f44c023c179b7d1822b6005755f4309c3f0f2368a0038ef06/68747470733a2f2f7777772e686f73746e65742e6e6c2f696d616765732f686f73746e65742e737667)](http://www.hostnet.nl)

[![Build Status](https://github.com/hostnet/asset-lib/actions/workflows/main.yaml/badge.svg)](https://github.com/hostnet/asset-lib/actions/workflows/main.yaml)

Assets can be manged in different ways. This project aims to provide a way to build assets incrementally without the need of specialized tools such as watchers and therefore requires no change in your development workflow.

This library allows you to create a generic asset pipeline and also provides some built-in processors to get you started quickly.

Core features are:

- Incremental changes without a watcher
- Plugin architecture to add your own processing
- Leverages the parallelization of NodeJS for fast processing
- Works on both Linux and Windows

#### Why use this over webpack?

[](#why-use-this-over-webpack)

This project allows for incremental changes without the need for a watcher. Moreover, because the code to check for changes is build in PHP, it has very little overhead when integrated into a PHP development workflow.

#### Why not use a watcher?

[](#why-not-use-a-watcher)

Watchers are great if you develop a single project. However, the resource usage can grow when having multiple project. Building assets (in development) when reloading a page only taxes your system when actually needed.

Installation
------------

[](#installation)

Instalation can be done using composer:

```
composer require hostnet/asset-lib
```

Usage
-----

[](#usage)

In the following example we have a setup for building multiple JS files into one large JS file and we added support for less.

For our input we have:

- `./assets/app.js`
- `./assets/module-a.js` (imported by app.js)
- `./assets/module-b.js` (imported by app.js)
- `./assets/styles.less`

This will output:

- `./web/dist/app.js`
- `./web/dist/styles.css`

Using the following snippet to build the assets. It is recommended to add it to something like a front-controller to build every time a request comes in so once a response comes back, all your assets are ready.

```
$config = new \Hostnet\Component\Resolver\Config\SimpleConfig(
    true, // is dev
    __DIR__,
    [],
    ['app.js'],
    ['styles.less'],
    'web',
    'dist',
    'assets',
    __DIR__ . '/var',
    [
        new \Hostnet\Component\Resolver\Plugin\CorePlugin(),
        new \Hostnet\Component\Resolver\Plugin\LessPlugin(),
    ],
    new \Hostnet\Component\Resolver\Import\Nodejs\Executable('/usr/bin/node', __DIR__ . '/node_modules/')
);

$packer = new \Hostnet\Component\Resolver\Packer();
$packer->pack($config);
```

> The project root should be the folder which contains your `package.json` and `composer.json`.

For the Symfony framework integration already exists in the form of the [asset-bundle](https://github.com/hostnet/asset-bundle).

### Including the made javascript

[](#including-the-made-javascript)

To use the entry-points, you need to do:

1. Include the outputted `require.js` file in the head of your HTML files
2. Include the outputted assets (in the example `dist/app.js`)
3. require the entry point module.

As an example:

```

        require('app.js');

```

### Built-in processors

[](#built-in-processors)

The library comes with some built-in processors to get you started more quickly with common tasks. These are:

- `\Hostnet\Component\Resolver\Plugin\CorePlugin`
    - Allows for combining Javascript files into modules
    - CSS assets
- `\Hostnet\Component\Resolver\Plugin\BrotliPlugin`
    - Used to also compress output files with Brotli
    - requires additionally `brotli/compress`
- `\Hostnet\Component\Resolver\Plugin\CssFontRewritePlugin`
    - Re-writes fonts in CSS files and adds them to the outputted list
- `\Hostnet\Component\Resolver\Plugin\GzipPlugin`
    - Used to also compress output files with Gzip
- `\Hostnet\Component\Resolver\Plugin\LessPlugin`
    - Allows for less compilation
    - requires additionally `less`
- `\Hostnet\Component\Resolver\Plugin\MinifyPlugin`
    - Compresses output files using minification
    - requires additionally `uglifyjs` and `cleancss`
- `\Hostnet\Component\Resolver\Plugin\TsPlugin`
    - Allows for typescript compilation
    - requies additionally `typescript`

#### Creating your own plugin

[](#creating-your-own-plugin)

If the built-in support is not sufficent enough, you can add your own by creating a plugin. You do this by implementing the `Hostnet\Component\Resolver\Plugin\PluginInterface` interface and adding your class to the configuration.

```