Running "htmlmin:dist" (htmlmin) task freezes - gruntjs

Running "htmlmin:dist" (htmlmin) task freezes when I run it in command line.
My task configuration is as follows:
htmlmin: { // Task
dist: { // Target
options: { // Target options
removeComments: true,
collapseWhitespace: true,
removeEmptyAttributes: true,
removeCommentsFromCDATA: true,
removeRedundantAttributes: true,
collapseBooleanAttributes: true
},
files: [{
expand: true,
cwd: '<%= cwdPath %>',
src: ['**/*.html', '!index-requirejs.html', '!online/**/*.html', '!onlinetradingmanagement/*.html'],
dest: '<%= destPath %>min/'
}]
}
}
Files are properly minified and generated as per the config, but from command line the execution of that task seems not to complete itself.
I want to integrate this into Jenkins-CI, so cannot afford on the task to freeze.

Found the reason behind this problem as it was occurring to some other people too suddenly out of nowhere.
Reference from the issue that I raised a few days back:
grunt-contrib-htmlmin
This issue might arise if you have invalid HTML.
Try running grunt htmlmin:dist --verbose
Check the file for syntax errors and see if that resolves the problem.

It would help to erase destination directory.
In my case, grunt couldn't overwrote minified files.

Related

Not able to Generate War file through Grunt

I am trying to create a war file through Grunt .
What i have did ?
I had created basic Angular App .
Added Gruntfile.js
I have tried with concat and other few task runners , which is working fine .
But when i tried to Create a war file i am not able to generate it .
my war file code snippet in Gruntfile is as follows
var taskConfig={
pkg: grunt.file.readJSON('package.json'),
war :{
target:{
options:{
war_dist_folder: 'D:/',
war_name: 'grunt'
},
files:[{
expand: true,
cwd: 'dist',
src: ['**'],
dest: ''
}]
}
}
}
grunt.loadNpmTasks( 'grunt-war' );
Grunt Code
Grunt Error
It happens because you call initConfig twice:
grunt.initConfig( taskConfig );
grunt.initConfig({
...
});
Tasks from the taskConfig are ignored in this case. Just tasks from the second call are available (it is the concat task in your case). Use just one config to fix it.
If you want to use multiple configurations, you have to use grunt.config.merge method instead of multiple calls of initConfig.

How to create source maps dynamically with grunt-closurecompiler

I can't get it to work. name_of_current_file needs to somehow be replaced with name of the current file being processed. It seems to me like the options property is only evaluated once and reused for each file.
closurecompiler: {
dev: {
files:[{
expand: true,
flatten: true,
cwd: 'www',
src: ['src/js/*.js', '!src/js/*.min.js'],
dest: 'www/build/js/',
ext: '.min.js',
}],
options: {
// Any options supported by Closure Compiler, for example:
"compilation_level": "ADVANCED_OPTIMIZATIONS",
"create_source_map": name_of_current_file+'.map',
// Plus a simultaneous processes limit
"max_processes": 4,
}
},
}
You can use the replacement variable %outname% in your source map naming.
"create_source_map": '%outname%.map'
Also, make sure you are using the officially supported Grunt Plugin.

Looking for Modernizr references

I'm trying to use the grunt-modernizr plugin in my project but I'm receiving the following output when I run tasks:
Running "modernizr:dist" (modernizr) task
>> Explicitly including these tests:
>> pointerevents
Looking for Modernizr references
I'm not receiving any type of error the terminal just goes back to the directory that I'm in, as if it's just giving up.
Here is my grunt file:
module.exports = function(grunt) {
grunt.initConfig ({
// Do grunt-related things in here
pkg: grunt.file.readJSON('package.json'),
modernizr: {
dist: {
"dest": "javascripts/modernizr-custom.js",
"parseFiles": true,
"customTests": [],
"devFile": "javascripts/modernizr-custom.js",
"outputFile": "javascripts/min/modernizr-custom.min.js",
"tests": [
"pointerevents",
"css/pointerevents"
],
"extensibility": [
"setClasses"
],
"uglify": false
}
},
cssmin: {
target: {
files: {
'css/min/bootstrap.min.css': ['css/bootstrap.css']
}
}
},
});
grunt.loadNpmTasks("grunt-modernizr");
grunt.loadNpmTasks('grunt-contrib-cssmin');
grunt.registerTask('default',['modernizr', 'cssmin']);
};
Output from running grunt --verbose:
Initializing
Command-line options: --verbose
Reading "gruntfile.js" Gruntfile...OK
Registering Gruntfile tasks.
Reading package.json...OK
Parsing package.json...OK
Initializing config...OK
Registering "grunt-modernizr" local Npm module tasks.
Reading /Applications/MAMP/htdocs/bootstrap-three-wordpress/wp-content/themes/brandozz/node_modules/grunt-modernizr/package.json...OK
Parsing /Applications/MAMP/htdocs/bootstrap-three-wordpress/wp-content/themes/brandozz/node_modules/grunt-modernizr/package.json...OK
Loading "modernizr.js" tasks...OK
+ modernizr
Registering "grunt-contrib-cssmin" local Npm module tasks.
Reading /Applications/MAMP/htdocs/bootstrap-three-wordpress/wp-content/themes/brandozz/node_modules/grunt-contrib-cssmin/package.json...OK
Parsing /Applications/MAMP/htdocs/bootstrap-three-wordpress/wp-content/themes/brandozz/node_modules/grunt-contrib-cssmin/package.json...OK
Loading "cssmin.js" tasks...OK
+ cssmin
Loading "gruntfile.js" tasks...OK
+ default
No tasks specified, running default tasks.
Running tasks: default
Running "default" task
Running "modernizr" task
Running "modernizr:dist" (modernizr) task
Verifying property modernizr.dist exists in config...OK
Files: -> javascripts/modernizr-custom.js
Verifying property modernizr exists in config...OK
>> Explicitly including these tests:
>> pointerevents
Looking for Modernizr references
This is something I just came across too and seems to be grunt-modernizr stopping after customizr doesn't find any files to crawl (it crawls by default).
If you add "crawl": false to your modernizr:dist task that should fix the problem.
Also, I think "extensibility": [ "setClasses" ], should be "options": [ "setClasses" ],.
To use the grunt-modernizr task to crawl your code for Modernizr references you'll have to look at the config properties for the customizr task as this is part of grunt-modernizr 's node_modules:
modernizr: {
dist: {
dest: 'bower_components/modernizr/build/modernizr.custom.js',
uglify: false,
options: [
'setClasses',
'addTest'
],
files: {
src: ['js/app/**/*.js', 'js/app/*.js']
}
}
}
devFile: doesn't seem to matter where you point at
dest: instead of outputFile, note I'm just outputting to a build directory that's not part of the package
uglify: false if you have other minifying options like bundleconfig.json
options: to bypass the default options { "setClasses", "addTest", "html5printshiv", "testProp", "fnBind" }
files: to enlist your crawlable director(y|ies), make sure you take care of the root files and/or subdirectories as well
Load the required tasks, in my case:
grunt.loadNpmTasks('grunt-contrib-clean');
grunt.loadNpmTasks('grunt-modernizr');
grunt.loadNpmTasks('grunt-contrib-copy');
Refer to the 'modernizr:dist' task => grunt.registerTask('default', ['clean', 'modernizr:dist', 'copy']);
Which results in an unminified 34kb file:
Running "clean:files" (clean) task
19 paths cleaned.
Running "modernizr:dist" (modernizr) task
Looking for Modernizr references
1 match in js/app/classes/yambo.options.js
bgpositionxy
1 match in js/app/modules/yambo.audio.js
audio
Ready to build using these settings:
setClasses, addTest
Building your customized Modernizr...OK
Success! Saved file to bower_components/modernizr/build/modernizr.custom.js
Process terminated with code 0.
Running "copy:main" (copy) task
Copied 11 files
Done, without errors.
This way there's no need to even go to the online build to add a feature test. Simply reference Modernizr throughout your js code:
window.Yambo = (function($, modernizr, ns){
ns.Audio = {
extension: (function () {
return modernizr && modernizr.audio.mp3
? 'mp3'
: modernizr.audio.ogg
? 'ogg'
: 'wav';
}())
};
return ns;
}(window.jQuery, window.Modernizr, window.Yambo || {}));
Make sure to use the correct property name for a feature detection, so customizr can pick it up and provide a test to your custom build.
This should be also possible for css but haven't been testing that for the moment.
It looks like you missed source files.
http://gruntjs.com/configuring-tasks#files-object-format
Try to include
"dist": {
"files": {
"src": ['!<%= appDir %>assets/js/bower/modernizr/**']
}
}

Grunt Browserify max call stack size exceeded

I am using grunt-browserify to compile my react/flux application. I've also enabled Watchify under browserify options so speed up the compile process. It compiles fine when first run, but once I change a file and it compiles again, a Maximum Call Stack Size Exceeded error appears in the browser's console and breaks the application.
It seems that Watchify is adding react/flux/other dependencies again on a recompile which causes the error. Just a theory.
Any ideas?
Grunt Task
browserify: {
dist: {
files: {
'public/dist/bundle.js': ['public/js/**/*.jsx', 'public/js/**/*.js']
},
options: {
debug: true,
bare: true,
alias: [
'./node_modules/react/dist/react-with-addons.js:react',
'./node_modules/flux/index.js:flux',
'./public/lib/react-router/react-router.js:react-router',
'./node_modules/lodash/index.js:lodash'
],
transform: [react.browserify],
watch: true,
keepAlive: true
}
}
}
Register
grunt.registerTask('compile', ['browserify']);
Did you try ignore 'public/dist/bundle.js' for watching ?

Configure Grunt File Name Matching for Files with Multiple Dots

I just started using grunt, and love it.
I keep running into an issue that seems like it might be pretty common.
Here it is. I have files named so that words after a dot are something like classes. eg:
layout.coffee
layout.blog.coffee
layout.site.coffee
My grunt task is configured to watch these files and translate them to js like this:
coffee:
dev:
files: [
expand: true
cwd: "<%= yeoman.app %>"
src: ["**/*.coffee"]
dest: "<%= yeoman.dev %>"
ext: ".js"
]
The problem, I think, is that using ext makes the target for all three .coffee files the destination file layout.js, which isn't the intention.
Is there a nice way to configure grunt file mapping for filenames with multiple dots?
Right now I have to change my naming convention to use - instead of ., which is a drag :(
Note that there is another option "extDot" that you can use to specify after which dot the ext should apply (first or last):
E.g.
files: [{
expand: true,
src: ['*.js','!*min.js'],
dest: 'js',
cwd: 'js',
ext: '.min.js',
extDot: 'last'
}]
Take a look at the "Building the files object dynamically" section of Configuring Tasks.
Instead of specifying ext, you can specify rename which is a function that lets you create your own mapping for the file names.
The problem you are running into was brought up as an issue on github and the answer from the grunt folks was that the "extension" of a file should be everything after the first "." instead of the last.
Hope that helps you!
That's the workaround I'm using in my projects:
uglify : {
build : {
src : ['**/*.js', '!*.min.js'],
cwd : 'js/',
dest : 'js/',
expand : true,
rename : function (dest, src) {
var folder = src.substring(0, src.lastIndexOf('/'));
var filename = src.substring(src.lastIndexOf('/'), src.length);
filename = filename.substring(0, filename.lastIndexOf('.'));
return dest + folder + filename + '.min.js';
}
}
}
When the filename is like jquery.2.0.3.js then after minifying that it will be jquery.2.0.3.min.js.

Resources