{"id":17148666,"url":"https://github.com/lcharette/webpack-encore-twig","last_synced_at":"2025-08-29T17:39:45.883Z","repository":{"id":57013036,"uuid":"444619108","full_name":"lcharette/webpack-encore-twig","owner":"lcharette","description":"Webpack Encore Standalone Twig Functions","archived":false,"fork":false,"pushed_at":"2024-10-03T00:18:17.000Z","size":42,"stargazers_count":2,"open_issues_count":0,"forks_count":1,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-05-28T00:36:54.099Z","etag":null,"topics":["encore","php","symfony-encore","twig","twig-functions","webpack","webpack-encore"],"latest_commit_sha":null,"homepage":"","language":"PHP","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/lcharette.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null},"funding":{"github":null,"patreon":null,"open_collective":null,"ko_fi":"lcharette","tidelift":null,"community_bridge":null,"liberapay":null,"issuehunt":null,"otechie":null,"custom":null}},"created_at":"2022-01-05T01:24:23.000Z","updated_at":"2024-10-03T00:18:20.000Z","dependencies_parsed_at":"2025-04-12T06:30:44.414Z","dependency_job_id":"aeceff7c-af30-4958-9c84-c4aeba2f2c6c","html_url":"https://github.com/lcharette/webpack-encore-twig","commit_stats":{"total_commits":9,"total_committers":1,"mean_commits":9.0,"dds":0.0,"last_synced_commit":"88ec9dbcc4d36b09bb8f5f5e8a1fa082aeb04c03"},"previous_names":[],"tags_count":3,"template":false,"template_full_name":null,"purl":"pkg:github/lcharette/webpack-encore-twig","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lcharette%2Fwebpack-encore-twig","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lcharette%2Fwebpack-encore-twig/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lcharette%2Fwebpack-encore-twig/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lcharette%2Fwebpack-encore-twig/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/lcharette","download_url":"https://codeload.github.com/lcharette/webpack-encore-twig/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/lcharette%2Fwebpack-encore-twig/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":272733244,"owners_count":24984260,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-08-29T02:00:10.610Z","response_time":87,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["encore","php","symfony-encore","twig","twig-functions","webpack","webpack-encore"],"created_at":"2024-10-14T21:29:26.959Z","updated_at":"2025-08-29T17:39:45.861Z","avatar_url":"https://github.com/lcharette.png","language":"PHP","funding_links":["https://ko-fi.com/lcharette"],"categories":[],"sub_categories":[],"readme":"# Webpack Encore Twig Integration\n\n[![Version](https://img.shields.io/github/v/release/lcharette/webpack-encore-twig?sort=semver)](https://github.com/lcharette/webpack-encore-twig/releases)\n![PHP Version](https://img.shields.io/badge/php-%5E8.0-brightgreen)\n[![License](https://img.shields.io/badge/license-MIT-brightgreen.svg)](LICENSE)\n[![Build](https://img.shields.io/github/actions/workflow/status/lcharette/webpack-encore-twig/Build.yml?logo=github)](https://github.com/lcharette/webpack-encore-twig/actions)\n[![Codecov](https://codecov.io/gh/lcharette/webpack-encore-twig/branch/main/graph/badge.svg)](https://app.codecov.io/gh/lcharette/webpack-encore-twig/branch/main)\n[![StyleCI](https://github.styleci.io/repos/444619108/shield?branch=main\u0026style=flat)](https://github.styleci.io/repos/444619108)\n[![PHPStan](https://img.shields.io/github/actions/workflow/status/lcharette/webpack-encore-twig/PHPStan.yml?label=PHPStan)](https://github.com/lcharette/webpack-encore-twig/actions/workflows/PHPStan.yml)\n[![Donate](https://img.shields.io/badge/Donate-Buy%20Me%20a%20Coffee-blue.svg)](https://ko-fi.com/lcharette)\n\nWebpack Encore Standalone Twig Functions. Allows usage of Webpack Encore in Twig Templates without Symfony. Optimized for PHP-DI style containers.\n\nThis allows you to use the `splitEntryChunks()` and `enableVersioning()` features from Webpack Encore by reading the `entrypoints.json` and `manifest.json` files.\n\n## Installation\n```\ncomposer require lcharette/webpack-encore-twig\n```\n\n## Documentation \u0026 Usage\n\nWhenever 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.\n\nThe 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.\n\nThe 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).\n\nBoth 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.\n\n### `splitEntryChunks` and `entrypoints.json`\n\nEncore 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`).\n\n```php\nuse Lcharette\\WebpackEncoreTwig\\EntrypointsTwigExtension;\nuse Lcharette\\WebpackEncoreTwig\\TagRenderer;\nuse Symfony\\WebpackEncoreBundle\\Asset\\EntrypointLookup;\nuse Twig\\Environment;\nuse Twig\\Loader\\FilesystemLoader;\n\n$entryPoints = new EntrypointLookup('./path/to/entrypoints.json');\n$tagRenderer = new TagRenderer($entryPoints);\n$extension = new EntrypointsTwigExtension($entryPoints, $tagRenderer);\n\n// Create Twig Environment and add extension\n$loader = new FilesystemLoader('./path/to/templates');\n$twig = new Environment($loader);\n$twig-\u003eaddExtension($extension);\n```\n\nNow, to render all of the `script` and `link` tags for a specific \"entry\" (e.g. `entry1`), you can:\n\n```twig\n{# any template or base layout where you need to include a JavaScript entry #}\n\n{% block javascripts %}\n    {{ parent() }}\n\n    {{ encore_entry_script_tags('entry1') }}\n\n    {# or render a custom attribute #}\n    {#\n    {{ encore_entry_script_tags('entry1', attributes={\n        defer: true\n    }) }}\n    #}\n{% endblock %}\n\n{% block stylesheets %}\n    {{ parent() }}\n\n    {{ encore_entry_link_tags('entry1') }}\n{% endblock %}\n```\n\nIf 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.\n\n#### Custom Attributes on script and link Tags\n\nCustom attributes can be added to rendered `script` or `link` in 3 different ways:\n\n1. Via global config, using the `defaultAttributes` argument on the TagRenderer constructor, or using the setter method: \n   ```\n   $tagRenderer-\u003esetDefaultAttributes(['crossorigin' =\u003e 'anonymous']);\n   ``` \n\n1. Via specific _script_ or _link_ argument on the TagRenderer constructor, or using the setter method:\n   ```\n   $tagRenderer-\u003esetDefaultScriptAttributes(['defer' =\u003e null]);\n   $tagRenderer-\u003esetDefaultLinkAttributes(['hreflang' =\u003e 'en']);\n   ``` \n\n1. When rendering in Twig - see the `attributes` option in the docs above.\n\n\n### `enableVersioning` and `manifest.json`\n\nTo 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`.\n\n```php \nuse Lcharette\\WebpackEncoreTwig\\JsonManifest;\nuse Lcharette\\WebpackEncoreTwig\\VersionedAssetsTwigExtension;\nuse Twig\\Environment;\nuse Twig\\Loader\\FilesystemLoader;\n\n$manifest = new JsonManifest('./path/to/manifest.json');\n$extension = new VersionedAssetsTwigExtension($manifest);\n\n// Create dumb Twig and test adding extension\n$loader = new FilesystemLoader();\n$twig = new Environment($loader);\n$twig-\u003eaddExtension($extension);\n```\n\nIn your Twig template, just wrap each path in the Twig `asset()` function like normal:\n\n```twig\n\u003cimg src=\"{{ asset('build/images/logo.png') }}\" alt=\"ACME logo\"\u003e\n```\n\n### Dependency Injection \u0026 Autowiring\n\nWhen 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 : \n\n```php\nuse Lcharette\\WebpackEncoreTwig\\JsonManifest;\nuse Lcharette\\WebpackEncoreTwig\\JsonManifestInterface;\nuse Symfony\\WebpackEncoreBundle\\Asset\\EntrypointLookup;\nuse Symfony\\WebpackEncoreBundle\\Asset\\EntrypointLookupInterface;\n\n// ...\n\nreturn [\n    EntrypointLookupInterface::class =\u003e function () {\n        return new EntrypointLookup('./path/to/entrypoints.json');\n    },\n    JsonManifestInterface::class =\u003e function () {\n        return new JsonManifest('./path/to/manifest.json');\n    },\n];\n```\n\n`EntrypointsTwigExtension` and `VersionedAssetsTwigExtension` can then be injected into your other classes via the container :\n\n```php\nuse Lcharette\\WebpackEncoreTwig\\EntrypointsTwigExtension;\nuse Lcharette\\WebpackEncoreTwig\\VersionedAssetsTwigExtension;\n\n// ...\n\n$extension = $container-\u003eget(EntrypointsTwigExtension::class);\n$twig-\u003eaddExtension($extension);\n\n$extension = $container-\u003eget(VersionedAssetsTwigExtension::class);\n$twig-\u003eaddExtension($extension);\n```\n\n### Using Without Twig\n\nBoth script and link tags can be generated in vanilla PHP and without Twig using the underlying public methods on the `TagRenderer` class:\n\n**Getting script and link tag from `entrypoints.json`:**\n```php\n$entryPoints = new EntrypointLookup('./path/to/entrypoints.json');\n$tagRenderer = new TagRenderer($entryPoints);\n\n// Returns the tags as string\n$scriptsString = $tagRenderer-\u003erenderWebpackScriptTags('entry1');\n$linksString = $tagRenderer-\u003erenderWebpackLinkTags('entry1');\n\n// Returns the list of files as an array of strings\n$jsFiles = $tagRenderer-\u003egetJavaScriptFiles('entry1');\n$cssFiles = $tagRenderer-\u003egetCssFiles('entry1');\n```\n\nSame goes for the versioned assets, using the underlying public methods on the `JsonManifest` class:\n\n**Getting versioned from `manifest.json`:**\n```php \n$manifest = new JsonManifest('./path/to/manifest.json');\n$path = $manifest-\u003eapplyVersion('build/images/logo.png');\n```\n\n## See Also\n- [Changelog](CHANGELOG.md)\n- [License](LICENSE)\n- [Style Guide](.github/STYLE-GUIDE.md)\n- [Testing](.github/RUNNING_TESTS.md)\n\n## References\n- https://symfony.com/doc/current/frontend.html\n- https://github.com/symfony/webpack-encore-bundle\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flcharette%2Fwebpack-encore-twig","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Flcharette%2Fwebpack-encore-twig","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Flcharette%2Fwebpack-encore-twig/lists"}