Bower with Visual Studio Publish - asp.net

Question

I want to use Bower in an MVC 4 application, developed in Visual Studio 2015. I know when you have a MVC 5 project, with Visual Studio 2015 Update 1, there is a nice UI for Bower management, much like the nuget interface. This part is not really critical.
I am using bower currently - I have npm and bower setup, and I have the package.json and bower.json files in the solution. When you save, Visual Studio automatically runs "npm install" and I have a postinstall step in package.json to run "bower install".
I do not want to put the bower_components into the solution (or source control). What I want is to just keep the json config files, and when you save, all dependencies are retrieved.
This all works fine in development, but what doesn't work is right clicking the Web Project, Publish. Publish does not run "npm install", and does not include files not included in the solution (except it seems to work with nuget packages not included in the solution somehow). The "Publish Web" functionality is how my web applications are deployed to production using IIS deployment.
How can I make Visual Studio Web Publish work with Bower?
An alternative - I have seen there are new hooks for Team System Builds that will run gulp tasks, but I don't know that you can publish directly to IIS in this manner.

Answer 1

instead of referencing/deploying the complete bower_components folder, you can use a gulp or grunt script (pick whatever you prefer) to copy the correct files out of the bower_components folder to something like scripts/lib.
You can then include these files in source control and subsequently deploy them.
The following is a grunt file that I use to accomplish this:
module.exports = function (grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON("package.json"),
copy: {
main: {
files: [
{
expand: true,
flatten: true,
src: [
'node_modules/vss-sdk/lib/VSS.SDK.js',
'node_modules/moment/moment.js',
'node_modules/moment-timezone/moment-timezone.js',
'node_modules/jquery/dist/jquery.js',
'bower_components/datetimepicker/jquery.datetimepicker.js',
'bower_components/datetimepicker/jquery.datetimepicker.css',
],
dest: 'scripts/lib',
filter: 'isFile'
}
]
}
}
});
grunt.loadNpmTasks("grunt-exec");
grunt.loadNpmTasks("grunt-contrib-copy");
};

Answer 2

In ASP.NET Core (ie MVC6), Bower is configured (in a .bowerrc file) to add scripts to wwwroot/lib rather than a bower_components folder. That content does get published by Visual Studio.
The same approach using .a bowerrc file will work for MVC4 webs (at least if you are using Visual Studio 2015). However, it also gets checked into version control so it might not be exactly what you want.
The .bowerrc file can be used to do various things (see http://bower.io/docs/config/). However, to get Bower to add scripts to the project in ~/scripts/lib, you simply add the following json:
{
"directory": "scripts/lib"
}