![]() ![]() Var gulp = require ( 'gulp' ) var rename = require ( 'gulp-rename' ) var package = require ( './package. When loading my external CSS and JavaScript files, I use WordPress to get the version number from my theme, so that it’s always pulling the right file based on the current theme.This file goes into the main theme directory rather than dist. Gulp adds all of the WordPress theme stylesheet header, including dynamically assigning the theme version from my package.json file. ♪dding Version Numbers to Enqueued Files. I keep an empty file in my src directory named style.css. This article will guide you through how to implement cache busting for stylesheets and JavaScript files in WordPress.When compiling my CSS and JS files, Gulp adds the current version number from my package.json file to the end of the file name.The dist files are the ones I link to in WordPress. All of my working files live in a src directory and are compiled into a dist directory.Since the file has a different name, the browser will download it as a new file.įor a while, I had been manually renaming my files and changing their references in markup, but over the last month, I started automating the whole thing with Gulp and WordPress. The easiest way to handle this is to add some sort of version number to the file name. The only snag with this is approach is that if I make an update to one of my files, someone who has an older version of my files in their cache won’t get the updated code. This tells browsers to hold on to them for a really long time (in my case, a year), so that there’s a few less assets to download on all visits and pages loads after the first. The following code snippet allows you to serve the minified stylesheet by default, but load the un-minified version for debugging complete with a cache-busting. ![]() I serve my CSS and JavaScript files with far-future expires headers. Automating CSS and JS cache-busting with Gulp and WordPress ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |