Develop Reference

Change the way to load files from grunt-karma 0.9 to 0.10?

It there any change of the way to load files in karma.options.files property from version 0.9.x to 0.10.x?
in 0.9.x I have this code and works fine
prj: {
src: 'src',
test: 'test',
jsPattern: '**/*.js',
files: {
src: ['<%= prj.src %>/<%= prj.jsPattern %>'],
srcTest: ['<%= prj.test %>/<%= prj.jsPattern %>']
}
},
karma: {
options: {
files: [
'<%= prj.files.src %>',
'<%= prj.files.srcTest %>'
]
}
}
but in 0.10.1 give me this error
WARN [config]: Invalid pattern src/**/*.js!
Object is missing "pattern" property.
WARN [config]: Invalid pattern test/**/*.js!
Object is missing "pattern" property.
For fixing I have to change
prj: {
src: 'src',
test: 'test',
jsPattern: '**/*.js',
files: {
src: '<%= prj.src %>/<%= prj.jsPattern %>',
srcTest: '<%= prj.test %>/<%= prj.jsPattern %>'
}
},
karma: {
options: {
files: [
'<%= prj.files.src %>',
'<%= prj.files.srcTest %>'
]
}
}
And it works! but,
How can include in karma.options.files an array of patterns like in first example?

Gruntjs angularjs cordova image not loading up

Not sure what I am doing wrong.
This is how my css looks like after grunt but my actual image filename is
backgorund-with-logo.d623d8e2.jpg
.containor{
min-height: 100%;
background: url('/images/backgorund-with-logo.d623d8e2.jpg') center 30% no-repeat;
background-size: 100%;
}
Gruntfile
usemin: {
html: ['<%= yeoman.dist %>/{,*/}*.html'],
css: ['<%= yeoman.dist %>/styles/{,*/}*.css'],
options: {
assetsDirs: ['<%= yeoman.dist %>','<%= yeoman.dist %>/images']
}
},
imagemin: {
dist: {
files: [{
expand: true,
cwd: '<%= yeoman.app %>/images',
src: '{,*/}*.{png,jpg,jpeg,gif}',
dest: '<%= yeoman.dist %>/images'
}]
}
},
filerev: {
dist: {
src: [
'<%= yeoman.dist %>/scripts/{,*/}*.js',
'<%= yeoman.dist %>/styles/{,*/}*.css',
'<%= yeoman.dist %>/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}',
'<%= yeoman.dist %>/styles/fonts/*'
]
}
},
But when i try to run on my android device and inspect through chrome
Failed to load resource file:///images/backgorund-with-logo.d623d8e2.jpg
Please help

This is not the best approach but I blocked minifying image by removing '<%= yeoman.dist %>/images/{,/}.{png,jpg,jpeg,gif,webp,svg}', from filerev. If there is a better approach, please let us know

How to let grunt usemin update the JS to reference our revved images?

How to let grunt usemin update the JS to reference our revved images ?
from the yeoman web app generator, it only rewrite links for css and html, but no js.
What if my JS file have some images need to be compressed, but cannot link :(
Here is my current parts of grunt.js
useminPrepare: {
options: {
dest: '<%= config.dist %>'
},
html: ['<%= config.app %>/*.php', '<%= config.app %>/*.html']
},
// Performs rewrites based on rev and the useminPrepare configuration
usemin: {
options: {
assetsDirs: ['<%= config.dist %>', '<%= config.dist %>/images']
},
html: ['<%= config.dist %>/{,*/}*.php','<%= config.dist %>/{,*/}*.html'],
css: ['<%= config.dist %>/styles/{,*/}*.css']
},
// The following *-min tasks produce minified files in the dist folder
imagemin: {
dist: {
files: [{
expand: true,
cwd: '<%= config.app %>/images',
src: '{,*/}*.{gif,jpeg,jpg,png}',
dest: '<%= config.dist %>/images'
}]
}
},...
I used to add js: ['<%= config.dist %>/scripts/{,*/}*.js'] after usemin:css, but it gives me Warning: Unsupported pattern: js Use --force to continue.
How can I write a correct format to let grunt usemin rewrite my JS image reference link to correct compressed image?

I managed to figure this, the answer came from this thread https://github.com/yeoman/grunt-usemin/issues/235#issuecomment-33266949
My usemin config ended up like this:
usemin: {
options: {
assetsDirs: ['<%= config.dist %>', '<%= config.dist %>/images', '<%= config.dist %>/styles/fonts'],
patterns: {
js: [
[/(images\/.*?\.(?:gif|jpeg|jpg|png|webp|svg))/gm, 'Update the JS to reference our revved images']
]
}
},
html: ['<%= config.dist %>/{,*/}*.html'],
css: ['<%= config.dist %>/styles/{,*/}*.css'],
js: ['<%= config.dist %>/scripts/{,*/}*.js']
},

Yeoman + Grunticon: Gruntfile.js problems

So i'm trying to use grunticon into my yo webapp (yeoman) but it says it cannot read any files.
Gruntfile.js:
svgmin: {
dist: {
files: [{
expand: true,
cwd: '<%= config.app %>/images/svg-src/',
src: '{,*/}*.svg',
dest: '<%= config.dist %>/images/svg-src/'
}]
}
},
grunticon: {
myIcons: {
options: {
src: '<%= config.app %>/images/svg-src/',
dest: '<%= config.app %>/images/svg-dist/'
}
}
},
Full Gruntfile.js: https://gist.github.com/ricardobanegas/6c8c4ad3ac57f49728d7
Patch: https://gist.github.com/ricardobanegas/7f2933bfb8e58d7ef30c
Unix:
$ grunt grunticon:myIcons
Running "grunticon:myIcons" (grunticon) task
Look, it's a grunticon!
Grunticon has no files to read!
Done, without errors.
So the question is really, why is Gruntfile.js not finding my images inside app/images/svg-src/?
References:
Grunticon
Yeoman+Grunticon install guidelines
Any ideas?

This was changed since version 1.0.0: https://github.com/filamentgroup/grunticon#whats-changed-in-this-major-version
Looks like I was following an old tutorial. Using files: [] instead of options: {} solved the problem:
grunticon: {
myIcons: {
files: [{
expand: true,
cwd: '<%= config.app %>/images/svg-src/',
src: '{,*/}*.svg',
dest: '<%= config.dist %>/images/svg-dist/'
}],
options: {
}
}
},

src must point to actual files, not just a folder.
src: '<%= config.app %>/images/svg-src/*.svg'

What does {,*/}*.* mean in Gruntfile.js

Opening Gruntfile.js generated by yeoman, I see this:
copy: {
dist: {
files: [{
expand: true,
dot: true,
cwd: '<%= config.app %>',
dest: '<%= config.dist %>',
src: [
'*.{ico,png,txt}',
'.htaccess',
'images/{,*/}*.webp',
'{,*/}*.html',
'styles/fonts/{,*/}*.*'
]
}]
},
styles: {
expand: true,
dot: true,
cwd: '<%= config.app %>/styles',
dest: '.tmp/styles/',
src: '{,*/}*.css'
}
},
What does {,*/}*.* mean? I can see it's trying to grab everything from the folder and I know * means any character. But I have no idea what the pattern do exactly...
Please help. Thank you very much.

{,*/}*.* is equivalent to */*.* OR *.*
It is a globbing pattern to search all files but only 1 folder deep.
If you want to search the files in all the subdirectories, you can use something like **/*.* but it can use more CPU if the folder tree is deep.