Production build uses versioning and the template doesn't point to that version

[jonginn]

When running in prod mode, the assets are made with Symfony Encore with versioning.

See webpack.config.js, line 17/18:

// enables hashed filenames (e.g. app.abc123.css)
.enableVersioning(Encore.isProduction())

However in _layouts/default.html, this still uses the non-versioned file:

<link rel="stylesheet" href="{{ site.url }}/build/app.css">

Running these commands:

yarn encore prod
./vendor/bin/sculpin generate --env=prod

I would expect to get a production ready site but app.css does not exist. I would expect default.html to point to app.HASH.css. The same is true for the JS.

Is there some way Sculpin can use encore_entry_link_tags and encore_entry_script_tags as Symfony does, or similar? I would much rather use the versioned assets, as then it helps with caching. I can't see anywhere in the Sculpin docs that does this.

I can see in this post from 2017 that "There is no easy way for Sculpin to handle the manifest.json file. Yet." is this something that's been resolved, or is the addition of enableVersioning in webpack.config.js an error?

I can see this comment that seems to cover the same issue: sculpin/sculpin#354 (comment)

If there's no way to use Encore versioning, is there some way I can use app.css?v={{ buildFragment }} where buildFragment is a random number that's created every time the site is built?

Thanks!

[jonginn]

As an update to this, I'm now using the Netlify plugin to generate hashes - https://github.com/munter/netlify-plugin-hashfiles which seems to work quite well.

[beryllium]

That looks like an interesting approach.

On one of my blogs, I used a Twig Extension to transform the build/manifest.json file into an array I can access in Twig, which lets me pluck out the values for including CSS and JS files with hashes. Today I'm working on a PR to bake this into the Sculpin Twig Bundle.

[jonginn]

@beryllium that looks great!

If it's of any help, I use a similar approach for Wordpress to allow Symfony Encore to build assets, and then allow Wordpress to enqueue all files related to an entry.

It works great with Encore's splitEntryChunks option, so multiple files can be made and auto-imported.

https://gist.github.com/jonginn/21a025421fc9ebf3bf7025d043fa0349

[devromans]

Check https://github.com/sculpin/sculpin/blob/master/src/Sculpin/Bundle/TwigBundle/WebpackEncoreHelper.php (I'm using "sculpin/sculpin":"^3.1").

Config app/config/sculpin_kernel.yml looks like:

sculpin_twig:
    webpack_manifest: build/manifest.json

Layout default.html:

<link rel="stylesheet" href="{{ site.url }}{{ webpack_manifest['build/app.css']|default('/build/app.css') }}">