Shopify automatically minimizes JavaScript files. It adds source mapping to the minified file:
//# sourceMappingURL=/s/files/1/0490/7981/t/6/assets/app.js.map?v=9459466
This feature is a great help for everybody to reduce the loading size.
Unfortunately, what is fantastic for production, is a massive problem for debugging in development.
Please can we have this feature disabled for Development Plan stores (test.myshopify.com)?
Thank you!
@Lothar_Bongartz - a good point, and this can be a problem in production as well as development.
Shopify recently started (without notice) automatically minifying an important JavaScript file on our installation, a third-party script we added to our theme files and have used successfully for years on our pages. The file was already minified for performance but Shopify’s further minification has broken the functionality (a music sample player).
I’ve tested this, and temporarily solved the issue, by referencing from our relevant Liquid template a copy of the original JS script on a different domain. This works fine, showing that the Shopify minification is breaking the functionality.
After a full day I’m still awaiting someone at Shopify support who understands this issue and can tell us whether minification can be switched off for this file alone, or for our entire site. Will post any progress.
A workaround has now been provided by Shopify, in line with their theme developer documentation here.
For any JS file which shouldn’t be minified further, rename it with a .min.js extension rather than just .js - this effectively signals to the postprocessor to ignore the file for minification.
Similarly with CSS files - rename to .min.css