title: yeoman webapp with grunt-connect-proxy not working
body: <p>I have installed the yeoman webapp generator and I am trying to set up a proxy to another server. </p>
  
  <p>I installed the proxy with the following.
  npm install grunt-connect-proxy --save-dev</p>
  
  <p>When I run grunt server, it shows</p>
  
  <pre><code>Running "configureProxies" task
  Proxy created for: /people to localhost:3000 
  </code></pre>
  
  <p>It then directs me to a page running on localhost:9000 which says "Cannot GET /"
  There is a server running at localhost:3000 and I have tried other domains with no succes.</p>
  
  <p>Here is my Gruntfile.js</p>
  
  <pre><code>// Generated on 2013-10-01 using generator-webapp 0.4.2
  'use strict';
  
  var proxySnippet = require('grunt-connect-proxy/lib/utils').proxyRequest;
  
  
  // # Globbing
  // for performance reasons we're only matching one level down:
  // 'test/spec/{,*/}*.js'
  // use this if you want to recursively match all subfolders:
  // 'test/spec/**/*.js'
  
  module.exports = function (grunt) {
  // show elapsed time at the end
  require('time-grunt')(grunt);
  // load all grunt tasks
  require('load-grunt-tasks')(grunt);
  
  // configurable paths
  var yeomanConfig = {
      app: 'app',
      dist: 'dist'
  };
  
  grunt.initConfig({
      yeoman: yeomanConfig,
      watch: {
          coffee: {
              files: ['&lt;%= yeoman.app %&gt;/scripts/{,*/}*.coffee'],
              tasks: ['coffee:dist']
          },
          coffeeTest: {
              files: ['test/spec/{,*/}*.coffee'],
              tasks: ['coffee:test']
          },
          compass: {
              files: ['&lt;%= yeoman.app %&gt;/styles/{,*/}*.{scss,sass}'],
              tasks: ['compass:server', 'autoprefixer']
          },
          styles: {
              files: ['&lt;%= yeoman.app %&gt;/styles/{,*/}*.css'],
              tasks: ['copy:styles', 'autoprefixer']
          },
          livereload: {
              options: {
                  livereload: '&lt;%= connect.options.livereload %&gt;'
              },
              files: [
                  '&lt;%= yeoman.app %&gt;/*.html',
                  '.tmp/styles/{,*/}*.css',
                  '{.tmp,&lt;%= yeoman.app %&gt;}/scripts/{,*/}*.js',
                  '&lt;%= yeoman.app %&gt;/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}'
              ]
          }
      },
      connect: {
          options: {
              port: 9000,
              livereload: 35729,
              // change this to '0.0.0.0' to access the server from outside
              hostname: 'localhost'
          },
          proxies: [
              {
                  context: '/people',
                  host: 'localhost',
                  port: 3000
              }
          ],
          livereload: {
              options: {
                  open: true,
                  base: [
                      '.tmp',
                      yeomanConfig.app
                  ],
                  middleware: function (connect) {
                      return [
                          proxySnippet
                      ];
                  }
              }
          },
          test: {
              options: {
                  base: [
                      '.tmp',
                      'test',
                      yeomanConfig.app
                  ]
              }
          },
          dist: {
              options: {
                  open: true,
                  base: yeomanConfig.dist
              }
          }
      },
      clean: {
          dist: {
              files: [{
                  dot: true,
                  src: [
                      '.tmp',
                      '&lt;%= yeoman.dist %&gt;/*',
                      '!&lt;%= yeoman.dist %&gt;/.git*'
                  ]
              }]
          },
          server: '.tmp'
      },
      jshint: {
          options: {
              jshintrc: '.jshintrc'
          },
          all: [
              'Gruntfile.js',
              '&lt;%= yeoman.app %&gt;/scripts/{,*/}*.js',
              '!&lt;%= yeoman.app %&gt;/scripts/vendor/*',
              'test/spec/{,*/}*.js'
          ]
      },
      mocha: {
          all: {
              options: {
                  run: true,
                  urls: ['http://&lt;%= connect.test.options.hostname %&gt;:&lt;%= connect.test.options.port %&gt;/index.html']
              }
          }
      },
      coffee: {
          dist: {
              files: [{
                  expand: true,
                  cwd: '&lt;%= yeoman.app %&gt;/scripts',
                  src: '{,*/}*.coffee',
                  dest: '.tmp/scripts',
                  ext: '.js'
              }]
          },
          test: {
              files: [{
                  expand: true,
                  cwd: 'test/spec',
                  src: '{,*/}*.coffee',
                  dest: '.tmp/spec',
                  ext: '.js'
              }]
          }
      },
      compass: {
          options: {
              sassDir: '&lt;%= yeoman.app %&gt;/styles',
              cssDir: '.tmp/styles',
              generatedImagesDir: '.tmp/images/generated',
              imagesDir: '&lt;%= yeoman.app %&gt;/images',
              javascriptsDir: '&lt;%= yeoman.app %&gt;/scripts',
              fontsDir: '&lt;%= yeoman.app %&gt;/styles/fonts',
              importPath: '&lt;%= yeoman.app %&gt;/bower_components',
              httpImagesPath: '/images',
              httpGeneratedImagesPath: '/images/generated',
              httpFontsPath: '/styles/fonts',
              relativeAssets: false
          },
          dist: {
              options: {
                  generatedImagesDir: '&lt;%= yeoman.dist %&gt;/images/generated'
              }
          },
          server: {
              options: {
                  debugInfo: true
              }
          }
      },
      autoprefixer: {
          options: {
              browsers: ['last 1 version']
          },
          dist: {
              files: [{
                  expand: true,
                  cwd: '.tmp/styles/',
                  src: '{,*/}*.css',
                  dest: '.tmp/styles/'
              }]
          }
      },
      // not used since Uglify task does concat,
      // but still available if needed
      /*concat: {
          dist: {}
      },*/
      requirejs: {
          dist: {
              // Options: https://github.com/jrburke/r.js/blob/master/build/example.build.js
              options: {
                  // `name` and `out` is set by grunt-usemin
                  baseUrl: yeomanConfig.app + '/scripts',
                  optimize: 'none',
                  // TODO: Figure out how to make sourcemaps work with grunt-usemin
                  // https://github.com/yeoman/grunt-usemin/issues/30
                  //generateSourceMaps: true,
                  // required to support SourceMaps
                  // http://requirejs.org/docs/errors.html#sourcemapcomments
                  preserveLicenseComments: false,
                  useStrict: true,
                  wrap: true
                  //uglify2: {} // https://github.com/mishoo/UglifyJS2
              }
          }
      },
      rev: {
          dist: {
              files: {
                  src: [
                      '&lt;%= yeoman.dist %&gt;/scripts/{,*/}*.js',
                      '&lt;%= yeoman.dist %&gt;/styles/{,*/}*.css',
                      '&lt;%= yeoman.dist %&gt;/images/{,*/}*.{png,jpg,jpeg,gif,webp}',
                      '&lt;%= yeoman.dist %&gt;/styles/fonts/{,*/}*.*'
                  ]
              }
          }
      },
      useminPrepare: {
          options: {
              dest: '&lt;%= yeoman.dist %&gt;'
          },
          html: '&lt;%= yeoman.app %&gt;/index.html'
      },
      usemin: {
          options: {
              dirs: ['&lt;%= yeoman.dist %&gt;']
          },
          html: ['&lt;%= yeoman.dist %&gt;/{,*/}*.html'],
          css: ['&lt;%= yeoman.dist %&gt;/styles/{,*/}*.css']
      },
      imagemin: {
          dist: {
              files: [{
                  expand: true,
                  cwd: '&lt;%= yeoman.app %&gt;/images',
                  src: '{,*/}*.{png,jpg,jpeg}',
                  dest: '&lt;%= yeoman.dist %&gt;/images'
              }]
          }
      },
      svgmin: {
          dist: {
              files: [{
                  expand: true,
                  cwd: '&lt;%= yeoman.app %&gt;/images',
                  src: '{,*/}*.svg',
                  dest: '&lt;%= yeoman.dist %&gt;/images'
              }]
          }
      },
      cssmin: {
          // This task is pre-configured if you do not wish to use Usemin
          // blocks for your CSS. By default, the Usemin block from your
          // `index.html` will take care of minification, e.g.
          //
          //     &lt;!-- build:css({.tmp,app}) styles/main.css --&gt;
          //
          // dist: {
          //     files: {
          //         '&lt;%= yeoman.dist %&gt;/styles/main.css': [
          //             '.tmp/styles/{,*/}*.css',
          //             '&lt;%= yeoman.app %&gt;/styles/{,*/}*.css'
          //         ]
          //     }
          // }
      },
      htmlmin: {
          dist: {
              options: {
                  /*removeCommentsFromCDATA: true,
                  // https://github.com/yeoman/grunt-usemin/issues/44
                  //collapseWhitespace: true,
                  collapseBooleanAttributes: true,
                  removeAttributeQuotes: true,
                  removeRedundantAttributes: true,
                  useShortDoctype: true,
                  removeEmptyAttributes: true,
                  removeOptionalTags: true*/
              },
              files: [{
                  expand: true,
                  cwd: '&lt;%= yeoman.app %&gt;',
                  src: '*.html',
                  dest: '&lt;%= yeoman.dist %&gt;'
              }]
          }
      },
      // Put files not handled in other tasks here
      copy: {
          dist: {
              files: [{
                  expand: true,
                  dot: true,
                  cwd: '&lt;%= yeoman.app %&gt;',
                  dest: '&lt;%= yeoman.dist %&gt;',
                  src: [
                      '*.{ico,png,txt}',
                      '.htaccess',
                      'images/{,*/}*.{webp,gif}',
                      'styles/fonts/{,*/}*.*',
                      'bower_components/sass-bootstrap/fonts/*.*'
                  ]
              }]
          },
          styles: {
              expand: true,
              dot: true,
              cwd: '&lt;%= yeoman.app %&gt;/styles',
              dest: '.tmp/styles/',
              src: '{,*/}*.css'
          }
      },
      modernizr: {
          devFile: '&lt;%= yeoman.app %&gt;/bower_components/modernizr/modernizr.js',
          outputFile: '&lt;%= yeoman.dist %&gt;/bower_components/modernizr/modernizr.js',
          files: [
              '&lt;%= yeoman.dist %&gt;/scripts/{,*/}*.js',
              '&lt;%= yeoman.dist %&gt;/styles/{,*/}*.css',
              '!&lt;%= yeoman.dist %&gt;/scripts/vendor/*'
          ],
          uglify: true
      },
      concurrent: {
          server: [
              'compass',
              'coffee:dist',
              'copy:styles'
          ],
          test: [
              'coffee',
              'copy:styles'
          ],
          dist: [
              'coffee',
              'compass',
              'copy:styles',
              'imagemin',
              'svgmin',
              'htmlmin'
          ]
      },
      bower: {
          options: {
              exclude: ['modernizr']
          },
          all: {
              rjsConfig: '&lt;%= yeoman.app %&gt;/scripts/main.js'
          }
      }
  });
  
  grunt.registerTask('server', function (target) {
      if (target === 'dist') {
          return grunt.task.run(['build', 'connect:dist:keepalive']);
      }
  
      grunt.task.run([
          'clean:server',
          'configureProxies',
          'concurrent:server',
          'autoprefixer',
          'connect:livereload',
          'watch'
      ]);
  });
  
  grunt.registerTask('test', [
      'clean:server',
      'concurrent:test',
      'autoprefixer',
      'connect:test',
      'mocha'
  ]);
  
  grunt.registerTask('build', [
      'clean:dist',
      'useminPrepare',
      'concurrent:dist',
      'autoprefixer',
      'requirejs',
      'concat',
      'cssmin',
      'uglify',
      'modernizr',
      'copy:dist',
      'rev',
      'usemin'
  ]);
  
  grunt.registerTask('default', [
      'jshint',
      'test',
      'build'
  ]);
  </code></pre>
  
  <p>};</p>
  
  <p>EDIT: here is my final working GruntFile</p>
  
  <pre><code>// Generated on 2013-10-06 using generator-webapp 0.4.3
  'use strict';
  
  var proxySnippet = require('grunt-connect-proxy/lib/utils').proxyRequest;
  var mountFolder = function (connect, dir) {
      return connect.static(require('path').resolve(dir));
  };
  
  // # Globbing
  // for performance reasons we're only matching one level down:
  // 'test/spec/{,*/}*.js'
  // use this if you want to recursively match all subfolders:
  // 'test/spec/**/*.js'
  
  module.exports = function (grunt) {
      // show elapsed time at the end
      require('time-grunt')(grunt);
      // load all grunt tasks
      require('load-grunt-tasks')(grunt);
  
      grunt.initConfig({
          // configurable paths
          yeoman: {
              app: 'app',
              dist: 'dist'
          },
          watch: {
              compass: {
                  files: ['&lt;%= yeoman.app %&gt;/styles/{,*/}*.{scss,sass}'],
                  tasks: ['compass:server', 'autoprefixer']
              },
              styles: {
                  files: ['&lt;%= yeoman.app %&gt;/styles/{,*/}*.css'],
                  tasks: ['copy:styles', 'autoprefixer']
              },
              livereload: {
                  options: {
                      livereload: '&lt;%= connect.options.livereload %&gt;'
                  },
                  files: [
                      '&lt;%= yeoman.app %&gt;/*.html',
                      '.tmp/styles/{,*/}*.css',
                      '{.tmp,&lt;%= yeoman.app %&gt;}/scripts/{,*/}*.js',
                      '&lt;%= yeoman.app %&gt;/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}'
                  ]
              }
          },
          connect: {
              options: {
                  port: 9000,
                  livereload: 35729,
                  // change this to '0.0.0.0' to access the server from outside
                  hostname: 'localhost'
              },
              proxies: [
                  {
                      context: '/api',
                      host: 'localhost',
                      port: 4000,
                      https: false
                  }
              ],
              livereload: {
                  options: {
                      open: true,
                      base: [
                          '.tmp',
                          '&lt;%= yeoman.app %&gt;'
                      ],
                      middleware: function (connect) {
                          return [
                              proxySnippet,
                              mountFolder(connect, '.tmp'),
                              mountFolder(connect, 'app')
                          ];
                      }
                  }
              },
              test: {
                  options: {
                      base: [
                          '.tmp',
                          'test',
                          '&lt;%= yeoman.app %&gt;'
                      ]
                  }
              },
              dist: {
                  options: {
                      open: true,
                      base: '&lt;%= yeoman.dist %&gt;'
                  }
              }
          },
          clean: {
              dist: {
                  files: [{
                      dot: true,
                      src: [
                          '.tmp',
                          '&lt;%= yeoman.dist %&gt;/*',
                          '!&lt;%= yeoman.dist %&gt;/.git*'
                      ]
                  }]
              },
              server: '.tmp'
          },
          jshint: {
              options: {
                  jshintrc: '.jshintrc'
              },
              all: [
                  'Gruntfile.js',
                  '&lt;%= yeoman.app %&gt;/scripts/{,*/}*.js',
                  '!&lt;%= yeoman.app %&gt;/scripts/vendor/*',
                  'test/spec/{,*/}*.js'
              ]
          },
          mocha: {
              all: {
                  options: {
                      run: true,
                      urls: ['http://&lt;%= connect.test.options.hostname %&gt;:&lt;%= connect.test.options.port %&gt;/index.html']
                  }
              }
          },
          compass: {
              options: {
                  sassDir: '&lt;%= yeoman.app %&gt;/styles',
                  cssDir: '.tmp/styles',
                  generatedImagesDir: '.tmp/images/generated',
                  imagesDir: '&lt;%= yeoman.app %&gt;/images',
                  javascriptsDir: '&lt;%= yeoman.app %&gt;/scripts',
                  fontsDir: '&lt;%= yeoman.app %&gt;/styles/fonts',
                  importPath: '&lt;%= yeoman.app %&gt;/bower_components',
                  httpImagesPath: '/images',
                  httpGeneratedImagesPath: '/images/generated',
                  httpFontsPath: '/styles/fonts',
                  relativeAssets: false,
                  assetCacheBuster: false
              },
              dist: {
                  options: {
                      generatedImagesDir: '&lt;%= yeoman.dist %&gt;/images/generated'
                  }
              },
              server: {
                  options: {
                      debugInfo: true
                  }
              }
          },
          autoprefixer: {
              options: {
                  browsers: ['last 1 version']
              },
              dist: {
                  files: [{
                      expand: true,
                      cwd: '.tmp/styles/',
                      src: '{,*/}*.css',
                      dest: '.tmp/styles/'
                  }]
              }
          },
          // not used since Uglify task does concat,
          // but still available if needed
          /*concat: {
              dist: {}
          },*/
          requirejs: {
              dist: {
                  // Options: https://github.com/jrburke/r.js/blob/master/build/example.build.js
                  options: {
                      // `name` and `out` is set by grunt-usemin
                      baseUrl: '&lt;%= yeoman.app %&gt;/scripts',
                      optimize: 'none',
                      // TODO: Figure out how to make sourcemaps work with grunt-usemin
                      // https://github.com/yeoman/grunt-usemin/issues/30
                      //generateSourceMaps: true,
                      // required to support SourceMaps
                      // http://requirejs.org/docs/errors.html#sourcemapcomments
                      preserveLicenseComments: false,
                      useStrict: true,
                      wrap: true
                      //uglify2: {} // https://github.com/mishoo/UglifyJS2
                  }
              }
          },
          rev: {
              dist: {
                  files: {
                      src: [
                          '&lt;%= yeoman.dist %&gt;/scripts/{,*/}*.js',
                          '&lt;%= yeoman.dist %&gt;/styles/{,*/}*.css',
                          '&lt;%= yeoman.dist %&gt;/images/{,*/}*.{png,jpg,jpeg,gif,webp}',
                          '&lt;%= yeoman.dist %&gt;/styles/fonts/{,*/}*.*'
                      ]
                  }
              }
          },
          useminPrepare: {
              options: {
                  dest: '&lt;%= yeoman.dist %&gt;'
              },
              html: '&lt;%= yeoman.app %&gt;/index.html'
          },
          usemin: {
              options: {
                  dirs: ['&lt;%= yeoman.dist %&gt;']
              },
              html: ['&lt;%= yeoman.dist %&gt;/{,*/}*.html'],
              css: ['&lt;%= yeoman.dist %&gt;/styles/{,*/}*.css']
          },
          imagemin: {
              dist: {
                  files: [{
                      expand: true,
                      cwd: '&lt;%= yeoman.app %&gt;/images',
                      src: '{,*/}*.{png,jpg,jpeg}',
                      dest: '&lt;%= yeoman.dist %&gt;/images'
                  }]
              }
          },
          svgmin: {
              dist: {
                  files: [{
                      expand: true,
                      cwd: '&lt;%= yeoman.app %&gt;/images',
                      src: '{,*/}*.svg',
                      dest: '&lt;%= yeoman.dist %&gt;/images'
                  }]
              }
          },
          cssmin: {
              // This task is pre-configured if you do not wish to use Usemin
              // blocks for your CSS. By default, the Usemin block from your
              // `index.html` will take care of minification, e.g.
              //
              //     &lt;!-- build:css({.tmp,app}) styles/main.css --&gt;
              //
              // dist: {
              //     files: {
              //         '&lt;%= yeoman.dist %&gt;/styles/main.css': [
              //             '.tmp/styles/{,*/}*.css',
              //             '&lt;%= yeoman.app %&gt;/styles/{,*/}*.css'
              //         ]
              //     }
              // }
          },
          htmlmin: {
              dist: {
                  options: {
                      /*removeCommentsFromCDATA: true,
                      // https://github.com/yeoman/grunt-usemin/issues/44
                      //collapseWhitespace: true,
                      collapseBooleanAttributes: true,
                      removeAttributeQuotes: true,
                      removeRedundantAttributes: true,
                      useShortDoctype: true,
                      removeEmptyAttributes: true,
                      removeOptionalTags: true*/
                  },
                  files: [{
                      expand: true,
                      cwd: '&lt;%= yeoman.app %&gt;',
                      src: '*.html',
                      dest: '&lt;%= yeoman.dist %&gt;'
                  }]
              }
          },
          // Put files not handled in other tasks here
          copy: {
              dist: {
                  files: [{
                      expand: true,
                      dot: true,
                      cwd: '&lt;%= yeoman.app %&gt;',
                      dest: '&lt;%= yeoman.dist %&gt;',
                      src: [
                          '*.{ico,png,txt}',
                          '.htaccess',
                          'images/{,*/}*.{webp,gif}',
                          'styles/fonts/{,*/}*.*',
                          'bower_components/sass-bootstrap/fonts/*.*',
                          'templates/{,*/}*.*'
                      ]
                  }]
              },
              styles: {
                  expand: true,
                  dot: true,
                  cwd: '&lt;%= yeoman.app %&gt;/styles',
                  dest: '.tmp/styles/',
                  src: '{,*/}*.css'
              }
          },
          concurrent: {
              server: [
                  'compass',
                  'copy:styles'
              ],
              test: [
                  'copy:styles'
              ],
              dist: [
                  'compass',
                  'copy:styles',
                  'imagemin',
                  'svgmin',
                  'htmlmin'
              ]
          },
          bower: {
              options: {
                  exclude: ['modernizr']
              },
              all: {
                  rjsConfig: '&lt;%= yeoman.app %&gt;/scripts/main.js'
              }
          }
      });
  
      grunt.registerTask('server', function (target) {
          if (target === 'dist') {
              return grunt.task.run(['build', 'connect:dist:keepalive']);
          }
  
          grunt.task.run([
              'clean:server',
              'configureProxies',
              'concurrent:server',
              'autoprefixer',
              'connect:livereload',
              'watch'
          ]);
      });
  
      grunt.registerTask('test', [
          'clean:server',
          'concurrent:test',
          'autoprefixer',
          'connect:test',
          'mocha'
      ]);
  
      grunt.registerTask('build', [
          'clean:dist',
          'useminPrepare',
          'concurrent:dist',
          'autoprefixer',
          'requirejs',
          'concat',
          'cssmin',
          'uglify',
          'copy:dist',
          'rev',
          'usemin'
      ]);
  
      grunt.registerTask('default', [
          'jshint',
          'test',
          'build'
      ]);
  };
  </code></pre>