Symfony Encore multiple asset manifests Symfony Encore multiple asset manifests symfony symfony

Symfony Encore multiple asset manifests


I've found a solution

assets:    base_path: 'path%'    packages:        noversion:            version: false            version_format: "%%1$s"            base_path: "path%"        stylesheets:            json_manifest_path: "%kernel.project_dir%/web/assets/stylesheets/manifest.json"        js:            json_manifest_path: "%kernel.project_dir%/web/assets/js/manifest.json"        admin:            json_manifest_path: "%kernel.project_dir%/web/assets/js/admin/manifest.json"

And then in .twig files, you need to call it as

    <script src="{{ asset('assets/DIRNAME/WEBPACK_ENTRY_NAME_HERE', ASSET_PACKAGE_NAME_HERE) }}"></script>

In my case

<script src="{{ asset('assets/js/backend.js', 'js') }}"></script>

Where WEBPACK_ENTRY_NAME is the name of the Webpack/Encore bundle from webpack.config.js, in my case

.setOutputPath('./web/assets/js')    .setPublicPath('/assets/js')    .addEntry('backend',

Sorry for delayed answer, but I forgot about it.


Webpack Encore use webpack-manifest-plugin to generate manifest.json file.

According to the doc, you can specify an options.seed when you setup your config.

A cache of key/value pairs to used to seed the manifest. This may include a set of custom key/value pairs to include in your manifest, or may be used to combine manifests across compilations in multi-compiler mode. To combine manifests, pass a shared seed object to each compiler's ManifestPlugin instance.

 Encore.configureManifestPlugin(options => {            let seed;            try {                // require your existing manifest content if exists                seed = require(path.join(outputPath, 'manifest.json'));            }            catch (e) {                // fallback if manifest.json is missing                seed = {};            }            // inject your latest config as seed.            // The plugin will update it and rewrite manifest.json with correct values (overwrite existing keys, append news)            options.seed = seed;           // Also i add a trick to avoid "License.txt" entries            options.generate = function(seed, files, entrypoints) {                // trick to avoid generate useless versionned entries like License                const filesWithoutLicense = files.filter(file => {                    return file.path.match(/.*LICENSE.*/) === null;                });                const newManifestContent = filesWithoutLicense.reduce(                    (newManifestContent, file) => {                        newManifestContent[file.name] = file.path;                        return newManifestContent;                    },                    seed                );                return newManifestContent;            }