PHPackages lcharette/webpack-encore-twig - 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. [Templating & Views](/categories/templating) 4. / 5. lcharette/webpack-encore-twig ActiveLibrary[Templating & Views](/categories/templating) lcharette/webpack-encore-twig ============================= Webpack Encore Standalone Twig Functions 1.2.0(2y ago)2116.4k↑24.8%11MITPHPPHP ^8.0CI passing Since Jan 5Pushed 1y ago1 watchersCompare [ Source](https://github.com/lcharette/webpack-encore-twig)[ Packagist](https://packagist.org/packages/lcharette/webpack-encore-twig)[ Docs](https://github.com/lcharette/webpack-encore-twig)[ Fund](https://ko-fi.com/lcharette)[ RSS](/packages/lcharette-webpack-encore-twig/feed)WikiDiscussions main Synced 1mo ago READMEChangelog (3)Dependencies (10)Versions (4)Used By (1) Webpack Encore Twig Integration =============================== [](#webpack-encore-twig-integration) [![Version](https://camo.githubusercontent.com/8ce8cf0abbca3c7fb7c1827cf2851fc0d2aa573714156b4a344e0be13a88fcb3/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f762f72656c656173652f6c63686172657474652f7765627061636b2d656e636f72652d747769673f736f72743d73656d766572)](https://github.com/lcharette/webpack-encore-twig/releases)[![PHP Version](https://camo.githubusercontent.com/3f18a8fc5fd9559818baf68827d4642d383d5eb273a13f542a19f8de71af749c/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f7068702d253545382e302d627269676874677265656e)](https://camo.githubusercontent.com/3f18a8fc5fd9559818baf68827d4642d383d5eb273a13f542a19f8de71af749c/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f7068702d253545382e302d627269676874677265656e)[![License](https://camo.githubusercontent.com/074b89bca64d3edc93a1db6c7e3b1636b874540ba91d66367c0e5e354c56d0ea/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f6c6963656e73652d4d49542d627269676874677265656e2e737667)](LICENSE)[![Build](https://camo.githubusercontent.com/e15a6a27b63e2c28f4ac0cd00c1781c81a2ce418ff0d31f9ad3ebe32c6cb7bfa/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f616374696f6e732f776f726b666c6f772f7374617475732f6c63686172657474652f7765627061636b2d656e636f72652d747769672f4275696c642e796d6c3f6c6f676f3d676974687562)](https://github.com/lcharette/webpack-encore-twig/actions)[![Codecov](https://camo.githubusercontent.com/3e5e7b65edecc6f1978b24591748e489e4fb5f0c437144ef05f1cf2665164d15/68747470733a2f2f636f6465636f762e696f2f67682f6c63686172657474652f7765627061636b2d656e636f72652d747769672f6272616e63682f6d61696e2f67726170682f62616467652e737667)](https://app.codecov.io/gh/lcharette/webpack-encore-twig/branch/main)[![StyleCI](https://camo.githubusercontent.com/a47dacbc5f2a8b72d711eafadb607720f14657e46a45a7e6dfb6f0a4ddb9d1cf/68747470733a2f2f6769746875622e7374796c6563692e696f2f7265706f732f3434343631393130382f736869656c643f6272616e63683d6d61696e267374796c653d666c6174)](https://github.styleci.io/repos/444619108)[![PHPStan](https://camo.githubusercontent.com/ce21a6e91d5ce9e3d56b942105c49674a1a6bf7c4c68b18ab4c1dbb0a53f9a08/68747470733a2f2f696d672e736869656c64732e696f2f6769746875622f616374696f6e732f776f726b666c6f772f7374617475732f6c63686172657474652f7765627061636b2d656e636f72652d747769672f5048505374616e2e796d6c3f6c6162656c3d5048505374616e)](https://github.com/lcharette/webpack-encore-twig/actions/workflows/PHPStan.yml)[![Donate](https://camo.githubusercontent.com/b7dc459938f321309f24018c6839ab1a99d6f0233f063a741ce7be1f607b88f5/68747470733a2f2f696d672e736869656c64732e696f2f62616467652f446f6e6174652d4275792532304d6525323061253230436f666665652d626c75652e737667)](https://ko-fi.com/lcharette) Webpack Encore Standalone Twig Functions. Allows usage of Webpack Encore in Twig Templates without Symfony. Optimized for PHP-DI style containers. This allows you to use the `splitEntryChunks()` and `enableVersioning()` features from Webpack Encore by reading the `entrypoints.json` and `manifest.json` files. Installation ------------ [](#installation) ``` composer require lcharette/webpack-encore-twig ``` Documentation & Usage ------------------------- [](#documentation--usage) Whenever you run [Encore](https://symfony.com/doc/current/frontend.html), two configuration files are generated in your output folder (default location: `public/build/`): `entrypoints.json` and `manifest.json`. Each file is similar, and contains a map to the final, versioned filenames. The first file – `entrypoints.json` – is generated when the [`splitEntryChunks()`](https://symfony.com/doc/current/frontend/encore/split-chunks.html) option is defined in your `webpack.config.js` and will be read by the `encore_entry_script_tags()` and `encore_entry_link_tags()` Twig helpers this package provides. If you're using these, then your CSS and JavaScript files will render with the new, versioned filename. The second file - `manifest.json` - is generated when [Asset Versioning](https://symfony.com/doc/current/frontend/encore/versioning.html#load-manifest-files) option (`enableVersioning()`) is defined in your `webpack.config.js` and will be read to get the versioned filename of *other* files, like font files or image files (though it also contains information about the CSS and JavaScript files). Both features (`splitEntryChunks()` and `enableVersioning()`) are defined as two separate Twig Extensions (`EntrypointsTwigExtension` and `VersionedAssetsTwigExtension` respectively) in case you need/want to enable only one of the two. ### `splitEntryChunks` and `entrypoints.json` [](#splitentrychunks-and-entrypointsjson) Encore writes an `entrypoints.json` file that contains all of the files needed for each "entry". To reference entries in Twig, you need to add the `EntrypointsTwigExtension` extension to the Twig Environment. This accept `EntrypointLookup`, which itself accept the path to the `entrypoints.json`, and the `TagRenderer` (which itself accept `EntrypointLookup`). ``` use Lcharette\WebpackEncoreTwig\EntrypointsTwigExtension; use Lcharette\WebpackEncoreTwig\TagRenderer; use Symfony\WebpackEncoreBundle\Asset\EntrypointLookup; use Twig\Environment; use Twig\Loader\FilesystemLoader; $entryPoints = new EntrypointLookup('./path/to/entrypoints.json'); $tagRenderer = new TagRenderer($entryPoints); $extension = new EntrypointsTwigExtension($entryPoints, $tagRenderer); // Create Twig Environment and add extension $loader = new FilesystemLoader('./path/to/templates'); $twig = new Environment($loader); $twig->addExtension($extension); ``` Now, to render all of the `script` and `link` tags for a specific "entry" (e.g. `entry1`), you can: ``` {# any template or base layout where you need to include a JavaScript entry #} {% block javascripts %} {{ parent() }} {{ encore_entry_script_tags('entry1') }} {# or render a custom attribute #} {# {{ encore_entry_script_tags('entry1', attributes={ defer: true }) }} #} {% endblock %} {% block stylesheets %} {{ parent() }} {{ encore_entry_link_tags('entry1') }} {% endblock %} ``` If you want more control, you can use the `encore_entry_js_files()` and `encore_entry_css_files()` methods to get the list of files needed, then loop and create the `script` and `link` tags manually. #### Custom Attributes on script and link Tags [](#custom-attributes-on-script-and-link-tags) Custom attributes can be added to rendered `script` or `link` in 3 different ways: 1. Via global config, using the `defaultAttributes` argument on the TagRenderer constructor, or using the setter method: ``` $tagRenderer->setDefaultAttributes(['crossorigin' => 'anonymous']); ``` 2. Via specific *script* or *link* argument on the TagRenderer constructor, or using the setter method: ``` $tagRenderer->setDefaultScriptAttributes(['defer' => null]); $tagRenderer->setDefaultLinkAttributes(['hreflang' => 'en']); ``` 3. When rendering in Twig - see the `attributes` option in the docs above. ### `enableVersioning` and `manifest.json` [](#enableversioning-and-manifestjson) To read the manifest file to be able to link (e.g. via an `img` tag) to certain assets, you need to add the `VersionedAssetsTwigExtension` extension to the Twig Environment. This accept `JsonManifest`, which itself accept the path to the `manifest.json`. ``` use Lcharette\WebpackEncoreTwig\JsonManifest; use Lcharette\WebpackEncoreTwig\VersionedAssetsTwigExtension; use Twig\Environment; use Twig\Loader\FilesystemLoader; $manifest = new JsonManifest('./path/to/manifest.json'); $extension = new VersionedAssetsTwigExtension($manifest); // Create dumb Twig and test adding extension $loader = new FilesystemLoader(); $twig = new Environment($loader); $twig->addExtension($extension); ``` In your Twig template, just wrap each path in the Twig `asset()` function like normal: ``` ``` ### Dependency Injection & Autowiring [](#dependency-injection--autowiring) When using a PSR Dependency Injection Container with autowiring, like [PHP-DI](https://php-di.org), you can define `EntrypointLookup` and `JsonManifest` in your [definition factory](https://php-di.org/doc/php-definitions.html#factories) via their respective interface (`EntrypointLookupInterface` and `JsonManifestInterface`). For example : ``` use Lcharette\WebpackEncoreTwig\JsonManifest; use Lcharette\WebpackEncoreTwig\JsonManifestInterface; use Symfony\WebpackEncoreBundle\Asset\EntrypointLookup; use Symfony\WebpackEncoreBundle\Asset\EntrypointLookupInterface; // ... return [ EntrypointLookupInterface::class => function () { return new EntrypointLookup('./path/to/entrypoints.json'); }, JsonManifestInterface::class => function () { return new JsonManifest('./path/to/manifest.json'); }, ]; ``` `EntrypointsTwigExtension` and `VersionedAssetsTwigExtension` can then be injected into your other classes via the container : ``` use Lcharette\WebpackEncoreTwig\EntrypointsTwigExtension; use Lcharette\WebpackEncoreTwig\VersionedAssetsTwigExtension; // ... $extension = $container->get(EntrypointsTwigExtension::class); $twig->addExtension($extension); $extension = $container->get(VersionedAssetsTwigExtension::class); $twig->addExtension($extension); ``` ### Using Without Twig [](#using-without-twig) Both script and link tags can be generated in vanilla PHP and without Twig using the underlying public methods on the `TagRenderer` class: **Getting script and link tag from `entrypoints.json`:** ``` $entryPoints = new EntrypointLookup('./path/to/entrypoints.json'); $tagRenderer = new TagRenderer($entryPoints); // Returns the tags as string $scriptsString = $tagRenderer->renderWebpackScriptTags('entry1'); $linksString = $tagRenderer->renderWebpackLinkTags('entry1'); // Returns the list of files as an array of strings $jsFiles = $tagRenderer->getJavaScriptFiles('entry1'); $cssFiles = $tagRenderer->getCssFiles('entry1'); ``` Same goes for the versioned assets, using the underlying public methods on the `JsonManifest` class: **Getting versioned from `manifest.json`:** ``` $manifest = new JsonManifest('./path/to/manifest.json'); $path = $manifest->applyVersion('build/images/logo.png'); ``` See Also -------- [](#see-also) - [Changelog](CHANGELOG.md) - [License](LICENSE) - [Style Guide](.github/STYLE-GUIDE.md) - [Testing](.github/RUNNING_TESTS.md) References ---------- [](#references) - - ### Health Score 37 — LowBetter than 83% of packages Maintenance29 Infrequent updates — may be unmaintained Popularity36 Limited adoption so far Community10 Small or concentrated contributor base Maturity57 Maturing project, gaining track record Bus Factor1 Top contributor holds 100% of commits — single point of failure How is this calculated?**Maintenance (25%)** — Last commit recency, latest release date, and issue-to-star ratio. Uses a 2-year decay window. **Popularity (30%)** — Total and monthly downloads, GitHub stars, and forks. Logarithmic scaling prevents top-heavy scores. **Community (15%)** — Contributors, dependents, forks, watchers, and maintainers. Measures real ecosystem engagement. **Maturity (30%)** — Project age, version count, PHP version support, and release stability. ### Release Activity Cadence Every ~350 days Total 3 Last Release 894d ago ### Community Maintainers ![](https://www.gravatar.com/avatar/a58517f6c9aea65a660cb28e0fe5e3139696c6d5a7c96f91576aff0f0267c750?d=identicon)[lcharette](/maintainers/lcharette) --- Top Contributors [![lcharette](https://avatars.githubusercontent.com/u/2566513?v=4)](https://github.com/lcharette "lcharette (17 commits)") --- Tags encorephpsymfony-encoretwigtwig-functionswebpackwebpack-encore ### Code Quality TestsPHPUnit Static AnalysisPHPStan Code StylePHP CS Fixer Type Coverage Yes ### Embed Badge ![Health badge](/badges/lcharette-webpack-encore-twig/health.svg) ``` [![Health](https://phpackages.com/badges/lcharette-webpack-encore-twig/health.svg)](https://phpackages.com/packages/lcharette-webpack-encore-twig) ``` ### Alternatives [twig/intl-extra A Twig extension for Intl 36763.2M221](/packages/twig-intl-extra)[rcrowe/twigbridge Adds the power of Twig to Laravel 9105.9M50](/packages/rcrowe-twigbridge)[twig/string-extra A Twig extension for Symfony String 22046.0M133](/packages/twig-string-extra)[twig/cssinliner-extra A Twig extension to allow inlining CSS 22918.5M55](/packages/twig-cssinliner-extra)[symfony/ux-twig-component Twig components for Symfony 21914.8M162](/packages/symfony-ux-twig-component)[twig/markdown-extra A Twig extension for Markdown 12114.3M83](/packages/twig-markdown-extra) PHPackages © 2026 [Directory](/)[Categories](/categories)[Trending](/trending)[Changelog](/changelog)[Analyze](/analyze)