grunt-newer won't work properly with Watchify - node.js

I use Grunt for Node with a bunch of packages. For example jsHint, jsDoc, Browserify, Uglify ...
I run the Gruntfile with Watchify and Newer for automation. So far, so good.
The Gruntfile, which works totaly fine:
module.exports = function(grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
jshint: {
all: ['my/js/files/*.js']
},
jsdoc : {
dist : {
src: ['my/js/files/*.js'],
options: {
destination: 'doc'
}
}
},
browserify: {
'public/js/files/script.js': ['my/js/files/*.js']
},
uglify: {
my_target: {
files: {
'public/js/files/script.js': ['public/js/files/script.js']
}
}
},
htmlmin: {
dist: {
files: {
'public/html/index.html': ['public/html/index.html']
}
}
},
cssmin: {
combine: {
files: {
'public/css/css.min.css': ['my/css/files/*.css']
}
}
},
watch: {
javascript: {
files: ['my/js/files/*.js'],
tasks: ['newer:jshint:all', 'jsdoc', 'browserify', 'uglify']
},
html: {
files: ['public/html/index.html'],
tasks: ['htmlmin']
},
css: {
files: ['public/css/*.css'],
tasks: ['cssmin']
}
}
});
// load plugins
grunt.loadNpmTasks('grunt-contrib-jshint');
grunt.loadNpmTasks('grunt-jsdoc');
grunt.loadNpmTasks('grunt-browserify');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-htmlmin');
grunt.loadNpmTasks('grunt-contrib-cssmin');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-newer');
};
It works as far as I only use Newer for jsHint. But if I try the same with jsDoc or Uglify I get Error-Messages.
Example:
I try this ...
tasks: ['newer:jshint:all', 'newer:jsdoc:all', 'browserify', 'uglify']
instead of ...
tasks: ['newer:jshint:all', 'jsdoc', 'browserify', 'uglify']
I get Error-Messages:
Running "newer:jsdoc:all" (newer) task
Warning: Cannot read property 'files' of undefined Use --force to continue.
Aborted due to warnings.
Why does it work for jsHint but not for the rest? Has anybody an idea? Would much appreciate some Hints!
Kind regards

the target of your jshint task is all, so newer:jshint:all is correct.
your jsdoc target is dist, so you have to use this target: newer:jsdoc:dist
for you it is even easier, you only have one target per task (only your watch task has multiple targets) so you could only do it like this:
['newer:jshint', 'newer:jsdoc', 'browserify', 'uglify']

Related

Grunt not compiling sass

I am working with an old project which uses grunt as a build tool, I had to install newer version of node-sass since to be able to rebuild node-sass. Now when I am trying to make changes in sass files, and run grunt I don't that anything has compiled. This is my Gruntfile.js:
module.exports = function(grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
sass: {
dist: {
options: {
outputStyle: 'compressed',
sourceComments: 'none'
},
files: {
'css/app.css': 'scss/app.scss'
}
},
dev: {
options: {
outputStyle: 'expanded',
sourceComments: 'map',
sourceMap: 'app.css.map'
},
files: {
'css/app.css': 'scss/app.scss'
}
}
},
watch: {
grunt: { files: ['Gruntfile.js'] },
sass: {
files: 'assets/scss/**/*.scss',
tasks: ['sass:dev']
},
css: {
files: ['assets/css/*.css'],
tasks: [],
options: {
livereload: true
}
}
}
});
grunt.loadNpmTasks('grunt-sass');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.registerTask('build', ['sass:dist']);
grunt.registerTask('default', ['sass:dev', 'watch']);
}
How can I fix this?
Looks like your path is wrong in your SASS task.
Replace:
'scss/app.scss'
with
'assets/scss/app.scss'

How do I run a node script through Grunt?

I am looking to run a node command through my gruntfile. I just need to run:
node index.js
as the first task before any other tasks. I tried searching around but haven't found the answer. I believe it might be something simple but I am not sure how. Do I need to load in nmp tasks?
This is how my Gruntfile looks like:
"use strict";
module.exports = function(grunt) {
// Project configuration.
grunt.initConfig({
jshint: {
all: [
'Gruntfile.js'
],
options: {
jshintrc: '.jshintrc',
},
},
// Before generating any new files, remove any previously-created files.
clean: {
tests: ['dist/*']
},
// Configuration to be run (and then tested).
mustache_render: {
json_data: {
files: [
{
data: 'jsons/offer.json',
template: 'offers.mustache',
dest: 'dist/offers.html'
},
{
data: 'jsons/profile.json',
template: 'profile.mustache',
dest: 'dist/profile.html'
}
]
}
}
});
// These plugins provide necessary tasks.
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-jshint');
grunt.loadNpmTasks('grunt-contrib-clean');
grunt.loadNpmTasks('grunt-mustache-render');
// Whenever the "test" task is run, first clean the "tmp" dir, then run this
// plugin's task(s), then test the result.
grunt.registerTask('default', ['clean', 'jshint', 'mustache_render']);
};
I want to run "node index.js" before the 'clean' task.
The standard way of doing this is to use the grunt-run task.
Do:
npm install grunt-run --save-dev
And in your grunt file:
grunt.loadNpmTasks('grunt-run');
And then some config (from the documentation):
grunt.initConfig({
run: {
options: {
// Task-specific options go here.
},
your_target: {
cmd: 'node',
args: [
'index.js'
]
}
}
})
Then you change the task registration to be this:
grunt.registerTask('default', ['run', 'clean', 'jshint', 'mustache_render']);

grunt tasks hanging and not responding

this is the first time I have this problem. I always use pretty much the same gruntfile configurations but at some point, my tasks are just hanging. more precisely they hang when triggered by grunt-contrib-watch. here's my config
watch: {
css: {
files: ['source/css/**/*.scss'],
tasks: ['sass:dist','sass:styleguide_specific_styles', 'postcss', 'shell:patternlab_css'],
options: {
spawn: false,
}
},
styleguide_specific_styles: {
files: ['public/styleguide/css/styleguide-specific.scss'],
tasks: ['sass:styleguide_specific_styles','sass:dist','shell:patternlab_css'],
options: {
spawn: false
}
},
}, //end of watch task
and my sass task
sass: {
styleguide_specific_styles: {
options: {
style: 'nested',
compass: 'true'
},
files: {
'public/styleguide/css/styleguide-specific.css': 'public/styleguide/css/styleguide-specific.scss'
}
},
dist: {
options: {
style: 'nested',
compass: 'true'
},
files: {
'source/css/styleguide.css': 'source/css/styleguide.scss'
}
}
}, //end of sass
When i edit and save an .scss file, i get stuck with this:
But if i stop grunt and just type grunt sass the compilation is successful.
I've tried removing compass, freshly reinstalling all dependencies copying the project elsewhere, updating grunt-contrib-sass , updating the sass gem, changing file permissions, updating nodejs but nothing seems to work. I'm on windows using this gruntfile config on a patternlab-php project.
The same configuration works on dozens of other projects, but not here.
And this is not the only task giving me this problem, all the others do the same.

Warning: Task "browserfy" not found

I want to use browserfy to transform es6 files to es5. But everytime the watch-task is executed I get the error:
Warning: Task "browserfy" not found. Use --force to continue.
I automate the task with the following gruntfile (simplified):
grunt.initConfig({
browserfy: {
dist: {
options: {
transform: [
["babelify", {
loose: "all"
}]
]
},
files: {
"dist/module.js": ["lib/main.js"]
}
}
},
watch: {
lib_test: {
files: '<%= jshint.lib_test.src %>',
tasks: ['jshint:lib_test', 'browserfy'/*, 'qunit'*/]
}
}});
grunt.loadNpmTasks("grunt-browserify");
grunt.loadNpmTasks('grunt-contrib-watch');
I also used the command
npm install grunt-browserify --save-dev
Solved the problem. I had a typo. It is "browserify.

grunt error: cannot find module 'load-grunt-tasks'

When I am using grunt command it is showing me following error:
$ grunt
Loading "Gruntfile.js" tasks...ERROR
>> Error: Cannot find module 'load-grunt-tasks'
Warning: Task "default" not found. Use --force to continue.
Aborted due to warnings.
Execution Time (2015-02-07 18:05:42 UTC)
loading tasks 339ms ███████████████████████████████████████████████ 99%
Total 344ms
I already tried - npm install, npm update commands. It would be great if someone can help me with this. Thanks!
Addding Content of Gruntfile.js
'use strict';
var paths = {
js: ['*.js', 'test/**/*.js', '!test/coverage/**', '!bower_components/**', 'packages/**/*.js', '!packages/**/node_modules/**', '!packages/contrib/**/*.js', '!packages/contrib/**/node_modules/**'],
html: ['packages/**/public/**/views/**', 'packages/**/server/views/**'],
css: ['!bower_components/**', 'packages/**/public/**/css/*.css', '!packages/contrib/**/public/**/css/*.css']
};
module.exports = function(grunt) {
if (process.env.NODE_ENV !== 'production') {
require('time-grunt')(grunt);
}
// Project Configuration
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
assets: grunt.file.readJSON('config/assets.json'),
clean: ['bower_components/build'],
watch: {
js: {
files: paths.js,
tasks: ['jshint'],
options: {
livereload: true
}
},
html: {
files: paths.html,
options: {
livereload: true,
interval: 500
}
},
css: {
files: paths.css,
tasks: ['csslint'],
options: {
livereload: true
}
}
},
jshint: {
all: {
src: paths.js,
options: {
jshintrc: true
}
}
},
uglify: {
core: {
options: {
mangle: false
},
files: '<%= assets.core.js %>'
}
},
csslint: {
options: {
csslintrc: '.csslintrc'
},
src: paths.css
},
cssmin: {
core: {
files: '<%= assets.core.css %>'
}
},
nodemon: {
dev: {
script: 'server.js',
options: {
args: [],
ignore: ['node_modules/**'],
ext: 'js,html',
nodeArgs: ['--debug'],
delayTime: 1,
cwd: __dirname
}
}
},
concurrent: {
tasks: ['nodemon', 'watch'],
options: {
logConcurrentOutput: true
}
},
mochaTest: {
options: {
reporter: 'spec',
require: [
'server.js',
function() {
require('meanio/lib/core_modules/module/util').preload(__dirname + '/packages/**/server', 'model');
}
]
},
src: ['packages/**/server/tests/**/*.js']
},
env: {
test: {
NODE_ENV: 'test'
}
},
karma: {
unit: {
configFile: 'karma.conf.js'
}
}
});
//Load NPM tasks
require('load-grunt-tasks')(grunt);
/**
* Default Task
*/
grunt.hook.push('clean', -9999);
grunt.hook.push('concurrent', 9999);
if (process.env.NODE_ENV === 'production') {
grunt.hook.push('cssmin', 100);
grunt.hook.push('uglify', 200);
} else {
grunt.hook.push('jshint', -200);
grunt.hook.push('csslint', 100);
}
//Default task.
grunt.registerTask('default', ['hook']);
//Test task.
grunt.registerTask('test', ['env:test', 'mochaTest', 'karma:unit']);
// For Heroku users only.
// Docs: https://github.com/linnovate/mean/wiki/Deploying-on-Heroku
grunt.registerTask('heroku:production', ['cssmin', 'uglify']);
};
Try running:
$ npm install
After that, if you run it and the error still persists or if there's another one, then you probably have not installed ruby, compass or both :)
I had the same issue, the problem for me was in my package.json where I didn't actually install the NPM package needed and it was not automatically installed as previously thought. Try doing
npm install --save-dev load-grunt-tasks
If that doesn't work can you provide the package.json file as well so we can get a little more information.
I was having the same issue you were having, it seems as though the gruntfile is missing a required initialization step.
By changing this:
require('load-grunt-tasks')(grunt);
/**
* Default Task
*/
grunt.hook.push('clean', -9999);
to this:
require('load-grunt-tasks')(grunt);
grunt.loadNpmTasks('grunt-hook');
/**
* Default Task
*/
grunt.hook.push('clean', -9999);
Adding the grunt.loadNpmTasks call, I'm able to get past that issue. The problem is, now I'm getting
Task "clean" not found. Use --force to continue.
Looking at the rest of the grunt file, i don't see a register task for clean. If I go to the mean.io docs, it looks like the build is failing. Perhaps this is part of why? I think I asked mean-cli for gulp version, that's probably why. I'll delete and take it from the top :)
I think the problem is related to where the npm dependencies are declared and the way Heroku handles them.
In few words, check if the npm packages are as dev dependencies and move them to the dependencies block, as suggested here: https://stackoverflow.com/a/20687098/532912.

Resources