Sort files on gulp-inject index task

Question

I am trying to sort my files since I am getting an Angular error because of the sort of the files.

This is my Gulp file

var gulp = require('gulp');
var angularFilesort = require('gulp-angular-filesort');
var naturalSort = require('gulp-natural-sort');
var inject = require('gulp-inject'); 

gulp.task('index', function () {
  var target = gulp.src('./public/index.html');
  var sources = gulp.src(
      ['./**/*.js', './**/*.css'],
      {
        read: false,
        cwd: __dirname + "/public/",
      }
    ).pipe(angularFilesort());

  return target.pipe(inject(sources, { addRootSlash: false }))
    .pipe(gulp.dest('./public'));
});

the files are sorting like this

    <!-- inject:js -->
    <script src="app.js"></script>
    <script src="controllers/add.js"></script>
    <script src="controllers/main.js"></script>
    <script src="filters/fromNow.js"></script>
    <script src="services/show.js"></script>
    <script src="vendor/angular-cookies.js"></script>
    <script src="vendor/angular-messages.js"></script>
    <script src="vendor/angular-resource.js"></script>
    <script src="vendor/angular-route.js"></script>
    <script src="vendor/angular-strap.js"></script>
    <script src="vendor/angular-strap.tpl.js"></script>
    <script src="vendor/angular.min.js"></script>
    <script src="vendor/moment.min.js"></script>
    <!-- endinject -->

and here the folders

and the console errors

so what am I missing?

Answer 1

Drop the {read: false} option. gulp-angular-sort needs the file contents to function and read: false prevents those from being read.

From the docs :

NOTE Do not use the read option for gulp.src ! This plugin analyzes the contents of each file to determine sort order.