node package manager
It’s your turn. Help us improve JavaScript. Take the 2017 JavaScript Ecosystem Survey »



Show grunt errors in a popup window in your browser.

This plugin will mirror the Grunt console output in a browser window when a plugin shows warnings or errors. The motivation is to avoid having to toggle back to a terminal window to see errors (ex. JSHint warnings) during a grunt/watch/livereload session.

Only works in modern browsers with WebSocket support.

Getting Started

npm install grunt-browser-output --save-dev

Once the plugin has been installed, it may be enabled inside your Gruntfile with this line of JavaScript:


Important: Using this plugin with grunt-contrib-watch and livereload requires grunt-contrib-watch version 0.6.0 or higher and you must configure livereloadOnError = false.

The "browser_output" task


In your project's Gruntfile, add a section named browser_output to the data object passed into grunt.initConfig().

  browser_output: {
    options: {       //all options are optional 
      port: 37901    //default is 37901 

Add browser_output before your watch task.

grunt.registerTask('serve', ['browser_output','connect', 'watch']);

Finally, add the following script tag to your web page:

<script src="node_modules/grunt-browser-output/client.js"></script>


If you run your site over HTTPS, you'll likely want to configure this task to also use HTTPS. Change the task config:

  browser_output: {
    options: {
       ssl: true,

And in your index.html add put ?ssl=true on the end of the client.js script tag:

<script src="node_modules/grunt-browser-output/client.js?ssl=true"></script>

Release History

  • 3/13/2014 - v0.1.0 - Initial release.