roots / grunt-wp-assets Goto Github PK
View Code? Open in Web Editor NEWUnsupported: WordPress assets revisioning
License: MIT License
Unsupported: WordPress assets revisioning
License: MIT License
We've been working on integrating the new manifest option into Roots 7.0.0 but we've found the current manifest json structure a little harder to use than it should be. Here's an example manifest.json:
{
"css": [
{
"path": "assets/css/main.min.css",
"hash": "3368efd25040cb4f23e72fb31c43e955",
"handle": "roots_css"
}
],
"js": [
{
"path": "assets/js/scripts.min.js",
"hash": "0fc6af96786d8f267c8686338a34cd38",
"handle": "roots_js"
}
],
"dest": "assets/manifest.json"
}
Right now to find a specific file, you'd have to find/filter/loop in the css
or js
arrays. We're thinking it would make more sense to have the original file path as the object key instead of an array. This could also mean ditching the top level css
or js
objects since there's no reason to separate them. Example:
{
"assets/css/main.css": {
"path": "assets/css/main.min.css",
"hash": "3368efd25040cb4f23e72fb31c43e955",
"handle": "roots_css"
},
"assets/js/scripts.js": {
"path": "assets/js/scripts.min.js",
"hash": "0fc6af96786d8f267c8686338a34cd38",
"handle": "roots_js"
},
"dest": "assets/manifest.json"
}
If a manifest destination is not defined, you get an error because the variable summary
stays undefined:
Warning: Cannot set property 'handle' of undefined
Solution:
in /tasks/version.js
change line 33 from:
var manifest = grunt.manifest || {css: [], js: []}, summary;
to:
var manifest = grunt.manifest || {css: [], js: []}, summary = {};
You're welcome...
And thanks for grunt-wp-assets, it's an awesome little helper...
When format is set to false, the replacement of previous hashed filenames does not work.
Type: Boolean
Default: false
This will generate manifest json without make change to destination script.
There has been a bit of labouring over how to handle versioning and cache busting for Roots 7.0.0.
The only two things in consensus is that scripts.php shouldn't be edited directly via regex; and a JSON manifest would provide a better solution. The manifest would just be a JSON file with entries containing the handle, hash and filename for each versioned file.
With this separation comes flexibility: if people want to use query strings they can, change the PHP and they can use the hash in the filename too. Renaming the source files should be optional in both instances; query strings don't need a name change, nor will those using server rewrites to cache bust.
It also means that changes to scripts.php become more meaningful, as they will no longer be updated with hashes.
It'd be nice not to have yet another fork to achieve this, so let me know what you think. Thanks!
Hi mate,
Do you know if it's possible to remove the old file version after start 'grunt version' ? Whenever I run the command, create a new css file :)
Thank you,
Currently, the querystring
option assumes the existence of only one stylesheet (roots_css
) and one script (roots_js
). But some projects do call for multiples of these files, e.g. to load CSS/JS conditionally on a page or subsection of a site.
Ideally, there should be a way to specify multiple querystrings, not tied to one style
or one script
.
Hi,
Could you fix the peerDepenecies on this? It's kinda old I know, but the following causes installation errors:
"peerDependencies": { "grunt": "~0.4.1" },
to
"peerDependencies": { "grunt": ">=0.4.1" },
Hi everybody,
First of, thank you for the grunt task! I'm really enjoying it!
So after a regeneration of my .less file that processes it to main.min.css
the grunt-wp-assets
task versions it to main.{sha1hash}.min.css
(main.f170406b.min.css
).
Then when I change something in a less file and a new main.min.css is processed. c.q. grunt-wp-assets
task created a new css file main.d41d8cd9.min.css
leaving the previous f170406b
file behind cluttering the directory.
Am I missing a setting or something or is that just not possible? Will dive in the grunt code, but I'm new too it so it may take a while ;)
Just letting you know this use case.
Ciao!
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.