Accessing root folder in yeoman project gives 404, but bower_components is not

Question

I've just created web project using yeoman angular generator. I noticed bower_components is in root folder. I want to put other components that is not installed using bower into not_bower_components folder (also in root folder). The problem is that it gives me 404 when i run grunt serve, but all files in bower_components do not return 404. How can i fix this?

Answer 1

The Gruntfile generated by angular generator uses connect for the http server, the generator also attaches a plugin to the server called livereload which magically injects new code or reloads the page (depending on the extension of the file modified), these are the defaults options of the Gruntfile.js file, I think you have to update the middleware function to also consider your not_bower_components folder:

livereload: {
  options: {
    open: true,
    middleware: function (connect) {
      return [
        connect.static('.tmp'),
        connect().use(
          '/bower_components',
          connect.static('./bower_components')
        ),
        connect().use(
          '/not_bower_components',
          connect.static('./not_bower_components')
        ),
        connect().use(
          '/app/styles',
          connect.static('./app/styles')
        ),
        connect.static(appConfig.app)
      ];
    }
  }
}