我刚刚创建了我的Gruntfile.js，它在运行grunt -v时向我显示以下错误：
Reading "Gruntfile.js" Gruntfile...OK
Registering Gruntfile tasks.
Loading "Gruntfile.js" tasks...ERROR
>> SyntaxError: Unexpected identifier
>> at exports.runInThisContext (vm.js:53:16)
>> at Module._compile (module.js:373:25)
>> at Object.Module._extensions..js (module.js:416:10)
>> at Module.load (/home/marc/repo/??????????/node_modules/grunt/node_modules/coffee-script/lib/coffee-script/register.js:45:36)
>> at Function.Module._load (module.js:300:12)
>> at Module.require (module.js:353:17)
>> at require (internal/module.js:12:17)
>> at loadTask (/home/marc/repo/??????????/node_modules/grunt/lib/grunt/task.js:316:10)
>> at Task.task.init (/home/marc/repo/??????????/node_modules/grunt/lib/grunt/task.js:437:5)
>> at Object.grunt.tasks (/home/marc/repo/??????????/node_modules/grunt/lib/grunt.js:111:8)
>> at Object.module.exports [as cli] (/home/marc/repo/??????????/node_modules/grunt/lib/grunt/cli.js:27:9)
>> at Object.<anonymous> (/usr/lib/node_modules/grunt-cli/bin/grunt:44:20)
>> at Module._compile (module.js:409:26)
>> at Object.Module._extensions..js (module.js:416:10)
>> at Module.load (module.js:343:32)
>> at Function.Module._load (module.js:300:12)
>> at Function.Module.runMain (module.js:441:10)
>> at startup (node.js:139:18)
>> at node.js:968:3
（在这里替换'??????????'的帖子）
现在我不知道我做错了什么，因为上面的堆栈跟踪没有给我任何相关的信息（据我理解）。
一般来说有没有办法调试Gruntfile.js？
这是我的Gruntfile.js：
module.exports = function(grunt) {
//Initializing the configuration object
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
/**
* Set project object
*/
project: {
app: './app',
output: './dist',
styles_path: './app/assets/stylesheets',
styles_output_path: './dist/assets/css'
js_path: './app/assets/js',
js_output_path: './dist/assets/js',
images_path: './app/assets/images',
images_output_path: './dist/assets/images',
},
// Task configuration
/**
* ------------------- concat
*/
concat: {
options: {
separator: ';',
},
js_main: {
src: [
'./bower_components/jquery/dist/jquery.js',
'./bower_components/bootstrap/dist/js/bootstrap.js',
'<%= project.js_path %>/*.js'
],
dest: '<%= project.js_output_path %>/main.js',
}
},
/**
* ------------------- copy
*/
copy: {
main: {
files: [
// includes files within path and its sub-directories
{
expand: true,
flatten: true,
src: ['<%= project.app %>/*.html'],
dest: '<%= project.output %>/',
filter: 'isFile'
}
],
},
images: {
files: [
// includes files within path and its sub-directories
{
expand: true,
flatten: true,
src: ['<%= project.images_path %>/**'],
dest: '<%= project.images_output_path %>/',
filter: 'isFile'
}
],
},
},
/**
* ------------------- Project banner
*/
// tag: {
// banner: '/*!\n' +
// ' * <%= pkg.name %>\n' +
// ' * <%= pkg.title %>\n' +
// ' * <%= pkg.url %>\n' +
// ' * @author <%= pkg.author %>\n' +
// ' * @version <%= pkg.version %>\n' +
// ' * Copyright <%= pkg.copyright %>. <%= pkg.license %> licensed.\n' +
// ' */\n'
// },
/**
* ------------------- Sass
*/
sass: {
dev: {
options: {
style: 'expanded',
// banner: '<%= tag.banner %>'
},
files: {
'<%= project.styles_output_path %>/app.css': '<%= project.styles_path %>/main.scss'
}
},
dist: {
options: {
style: 'compressed'
},
files: {
'<%= project.styles_output_path %>/app.css': '<%= project.styles_path %>/main.scss'
}
}
},
/**
* ------------------- uglify
*/
uglify: {
options: {
mangle: false // Use if you want the names of your functions and variables unchanged
},
main: {
files: {
'<%= project.js_output_path %>/main.js': '<%= project.js_output_path %>/main.js',
}
}
}
/**
* ------------------- Filesystem watcher
*/
watch: {
html_main: {
files: ['<%= project.app %>/*.html'], //watched files
tasks: ['copy'], //tasks to run
options: {
livereload: true //reloads the browser
}
},
js_main: {
files: [
//watched files
'<%= project.js_path %>/**'
],
tasks: ['concat:js_main', 'uglify:main'], //tasks to run
options: {
livereload: true //reloads the browser
}
},
sass: {
files: ['<%= project.styles_path %>/*.scss'], //watched files
tasks: ['sass:dev'], //tasks to run
options: {
livereload: true //reloads the browser
}
}
}
});
// Plugin loading
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-sass');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-copy');
// Task definition
grunt.registerTask('default', ['watch']);
// grunt.registerTask('build', ['copy', 'sass:dev', 'concat:js_main', 'uglify:main']);
};
答案 0 :(得分：3)
首先你的grunt配置有2个语法错误：
project: {
app: './app',
output: './dist',
styles_path: './app/assets/stylesheets',
styles_output_path: './dist/assets/css' <== missing comma here
js_path: './app/assets/js',
js_output_path: './dist/assets/js',
images_path: './app/assets/images',
images_output_path: './dist/assets/images',
},
在这里：
uglify: {
options: {
mangle: false // Use if you want the names of your functions and variables unchanged
},
main: {
files: {
'<%= project.js_output_path %>/main.js': '<%= project.js_output_path %>/main.js',
}
}
} <== another missing comma here
其次，您可以使用Visual Studio Code进行调试： 单击左侧的Debug按钮，创建一个新的配置文件。 将配置中的“程序”更改为grunt bin文件，如下所示，然后开始调试：
"configurations": [
{
"name": "Launch",
"type": "node",
"request": "launch",
"program": "${workspaceRoot}/node_modules//grunt/bin/grunt",
"stopOnEntry": false,
"args": [],
"cwd": "${workspaceRoot}",
"preLaunchTask": null,
"runtimeExecutable": null,
"runtimeArgs": [
"--nolazy"
],
"env": {
"NODE_ENV": "development"
},
"externalConsole": false,
"sourceMaps": false,
"outDir": null
},
答案 1 :(得分：2)
您可以使用“grunt -v -d”添加详细模式和调试模式，并获取更多信息。
答案 2 :(得分：0)
我去了JS syntax checker并且错误变得明显，而grunt --verbose --debug输出确实没有多大帮助。