Gulp using wiredep for bower dependencies: output different path

Question

I'm using Gulp with wiredep. The output I get is not the right path to my files. I'd like to change the output of that path accordingly.

Current path:

<script src="../bower_components/angular/angular.js"></script>

Wanted outcome:

<script src="./vendors/angular.js"></script>

Current gulp task:

gulp.task('index', function() {
  var target = gulp.src(files.app_files.target);
  var sources = gulp.src(files.app_files.sources, {
    read: false
  });
  // {caseSensitive: true }

  return target
    .pipe(inject(sources, {
      ignorePath: 'app'
    }))
    .pipe(wiredep())
    .pipe(gulp.dest('dist'));
});

Answer 1

wiredep is born to wire bower dependencies in your html.

Anyway you can set a programmatica acces to js like this

Programmatic Access
You can run wiredep without manipulating any files.

require('wiredep')();
...returns...

{
  js: [
    'paths/to/your/js/files.js',
    'in/their/order/of/dependency.js'
  ],
  css: [
    'paths/to/your/css/files.css'
  ],
  // etc. 
}

as you can find in the doc

As advice, in dev phase there is nothing wrong using bower_dependencies as your "repo". In build phase, when you prepare for prduction environment you can use useref in combination with wiredep and then move your builded file where you want it