I am using Grunt task runner, and the Gruntfile.js" is as follows:
'use strict';
module.exports = function(grunt){
require('time-grunt')(grunt);
require('jit-grunt')(grunt, {
useminPrepare: 'grunt-usemin'
});
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
jshint: {
options: {
jshintrc: '.jshintrc',
reporter: require('jshint-stylish')
},
all: {
src: ['Gruntfile.js', 'app/scripts/{,*/}*.js']
}
},
useminPrepare: {
html: 'app/menu.html',
options: {
dest: 'dist'
}
},
concat: {
options: {
separator: ';'
},
dist:{}
},
uglify:{
dist:{}
},
cssmin: {
dist:{}
},
filerev: {
options: {
encoding: 'utf8',
algorithm: 'md5',
length: 20
},
release: {
files:[{
src: ['dist/scripts/*.js', 'dist/styles/*.css']
}]
}
},
usemin: {
html: ['dist/*.html'],
css: ['dist/styles/*.css'],
options: {
assetsDirs: ['dist', 'dist/styles']
}
},
copy: {
dist: {
cwd: 'app',
src: ['**', '!styles/**/*.css', '!scripts/**/*.js'],
dest: 'dist',
expand: true
},
fonts: {
files: [
{
expand: true,
dot: true,
cwd: 'bower_components/bootstrap/dist',
src: ['fonts/*.*'],
dest: 'dist'
},
{
expand: true,
dot: true,
cwd: 'bower_components/font-awesome',
src: ['fonts/*.*'],
dest: 'dist'
}
]
}
},
clean: {
build:{
src: ['dist/']
}
}
});
grunt.registerTask('build', ['clean', 'jshint', 'useminPrepare', 'concat', 'cssmin', 'uglify', 'copy', 'filerev', 'usemin']);
grunt.registerTask('default', ['build']);
};
The problem is that when the grunt is executing usemin, it shows the following warning and aborts the task:
I cannot figure out exactly where the problem is and therefore I don't know how many more codes do I have to give. I am a beginner.
Update:
here is my own script that I used in the project:
'use strict';
angular.module('confusionApp', []).controller('menuController', function(){
var dishes=[
{
name:'Uthapizza',
image: 'images/uthapizza.png',
category: 'mains',
label:'Hot',
price:'4.99',
description:'A unique combination of Indian Uthappam (pancake) and Italian pizza, topped with Cerignola olives, ripe vine cherry tomatoes, Vidalia onion, Guntur chillies and Buffalo Paneer.',
comment: ''
},
{
name:'Zucchipakoda',
image: 'images/zucchipakoda.png',
category: 'appetizer',
label:'',
price:'1.99',
description:'Deep fried Zucchini coated with mildly spiced Chickpea flour batter accompanied with a sweet-tangy tamarind sauce',
comment: ''
},
{
name:'Vadonut',
image: 'images/vadonut.png',
category: 'appetizer',
label:'New',
price:'1.99',
description:'A quintessential ConFusion experience, is it a vada or is it a donut?',
comment: ''
},
{
name:'ElaiCheese Cake',
image: 'images/elaicheesecake.png',
category: 'dessert',
label:'',
price:'2.99',
description:'A delectable, semi-sweet New York Style Cheese Cake, with Graham cracker crust and spiced with Indian cardamoms',
comment: ''
}
];
this.dishes = dishes;
this.tab = 1;
this.filtText = '';
this.select = function(setTab){
this.tab = setTab;
if(setTab === 2){
this.filtText = "appetizer";
}
else if(setTab === 3){
this.filtText = "mains";
}
else if(setTab === 4){
this.filtText = "dessert";
}
else{
this.filtText = "";
}
};
this.isSelected = function(isTab){
if(this.tab === isTab){
return true;
}
return false;
};
});
Update
This is the stack trace of the error that I got.
Running "usemin:html" (usemin) task
Warning: Object has no method 'contains' Use --force to continue.
TypeError: Object has no method 'contains'
at replaceWith (E:\Study\Front End JS Framework AngularJS\conFusion\node_modules\grunt-usemin\lib\fileprocessor.js:170:16)
at null.<anonymous> (E:\Study\Front End JS Framework AngularJS\conFusion\node_modules\grunt-usemin\lib\fileprocessor.js:157:45)
at Array.forEach (native)
at replaceBlocks (E:\Study\Front End JS Framework AngularJS\conFusion\node_modules\grunt-usemin\lib\fileprocessor.js:155:15)
at FileProcessor.process (E:\Study\Front End JS Framework AngularJS\conFusion\node_modules\grunt-usemin\lib\fileprocessor.js:239:45)
at E:\Study\Front End JS Framework AngularJS\conFusion\node_modules\grunt-usemin\tasks\usemin.js:141:31
at Array.forEach (native)
at E:\Study\Front End JS Framework AngularJS\conFusion\node_modules\grunt-usemin\tasks\usemin.js:135:13
at Array.forEach (native)
at Object.<anonymous> (E:\Study\Front End JS Framework AngularJS\conFusion\node_modules\grunt-usemin\tasks\usemin.js:130:16)
The problem lies with the usemin
version that you are using. It turns out, changing your usemin
version from 3.1.1
to 3.0.0
in your package.json
solves the problem. My best bet is that there is no problem with your code but with the fileprocessor.js
file in your usemin. Changing the version solves the problem.
Change usemin version on your package.json and run npm install
.