Caching issues in Development since migrating to Shakapacker #88
Description
We used to run a pretty standard Webpacker 5 setup, which in Development resulted in HTML like this:
<head>
<link rel="stylesheet" media="all" href="/packs/css/application-e793e27b.css" data-turbo-track="reload" />
<script src="/packs/js/application-57eff0528424c89ab096.js" data-turbo-track="reload" defer="defer"></script>
<!-- etc. -->We then migrated to (equally plain/default) Shakapacker 6 setup, which in Development now results in HTML like this:
<head>
<link rel="stylesheet" media="all" href="/packs/css/application.css" data-turbo-track="reload" />
<script src="/packs/js/runtime.js" data-turbo-track="reload" defer="defer"></script>
<script src="/packs/js/vendors-node_modules_webpack-dev-server_client_index_js_protocol_ws_3A_hostname_localhost_por-54b5bb.js" data-turbo-track="reload" defer="defer"></script>
<script src="/packs/js/vendors-node_modules_babel_runtime_regenerator_index_js-node_modules_hotwired_turbo-rails_app-56e6f5.js" data-turbo-track="reload" defer="defer"></script>
<script src="/packs/js/application.js" data-turbo-track="reload" defer="defer"></script>
<!-- etc. -->We expected SplitChunks to be enabled here, however the contenthash has also been removed from some filenames, like runtime.js and most problematically application.js/application.css.
This is resulting in caching issues where the e.g. application.js file gets updated by Shakapacker during development, but the browser serves a cached version even after page refresh since the filename hasn't changed.
I can fix this with the following config/webpack/webpack.config.js, but it adds the missing hash only to the JS file, not also the CSS:
const { webpackConfig, merge } = require('shakapacker')
const customConfig = {
// Add contenthash to filenames in development to prevent browser serving cached files
output: {
filename: '[name].[contenthash].js'
}
}
module.exports = merge(webpackConfig, customConfig)Is this an expected change in Shakapacker? It doesn't seem a good default?
Edit: Looks like this might be a performance thing? Still, this is unexpected when migrating from Webpacker and probably not a good default.