Symfony Encore multiple asset manifests

Question

I have a question regarding Encore in Symfony 3.4 and asset versioning.

In my webpack.config.jsI have two configurations. First is for JS files, the other one for compiling .less.

Each configuration is reset by Encore.reset()

Output bundles are generating manifest with versioning via .enableVersioning, so I have two manifest.json in

web/js/manifest.json
web/stylesheets/manifest.json

According to docs, to have my assets loaded via manifest I need to declare it in config.yml

   assets:
        base_path: "%myapp.http.site_assets_suffix%" 
        stylesheets:
            json_manifest_path: "%kernel.project_dir%/web/assets/stylesheets/manifest.json"

If I want to link to style.css generated by webpack, I use

asset("stylesheets/style.css")

But in my application I have two manifests and I think this can't be changed due to two Encore configurations.

I've tried adding something in likes of

packages:
     stylesheets:
                json_manifest_path: "%kernel.project_dir%/web/assets/stylesheets/manifest.json"
     js:
                json_manifest_path: "%kernel.project_dir%/web/assets/js/manifest.json"

because I saw that somewhere, but unfortunately this won't work at all.

I've thought about combining two manifests into one in last webpack entry point, but this can be time consuming.

Is there any other solution than combining manfiests or combining js + less compilation into one big Encore task?

Answer 1

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.