Co naprawdę działa na gulp-inject?

Question

Czy ktokolwiek może pokazać przykład tego, co naprawdę robi plik gulp-angleular-filesort i jak z niego korzystać?

Chodzi o to, że ja niedawno sobie sprawę, że moja łyk-kątowa-filesort nie sort angularjs plików na wszystko, jednak moja angularjs App z dużą ilością plików działa bez zarzutu. Tak, mam dwa pytania:

1. Czy AngualarJs jest nadal wrażliwy na kolejność plików źródłowych? Jeśli chodzi o mnie, wygląda na to, że tak nie jest.
2. Co właściwie robi port-angular-wideort? Nie widzę żadnych rezultatów jego pracy.

Wydaje mi się, że gulp-angular-filesort sprawdza instrukcje angular.module i sortuje pliki zgodnie z określoną zależnością w nawiasach. Wygląda na to, że się myliłem.

Proszę spojrzeć na moją próbkę poniżej.

// Plik: Gulpfile.js

'use strict'; 

var 
    gulp = require('gulp'), 
    connect = require('gulp-connect'), 
    angularFilesort = require('gulp-angular-filesort'), 
    inject = require('gulp-inject'); 


gulp.task('default', function() { 

    gulp.src('app/index.html') 
     .pipe(inject(
      gulp.src(['app/js/**/*.js']).pipe(angularFilesort()), 
      { 
       addRootSlash: false, 
       ignorePath: 'app' 
      } 
     )) 
     .pipe(gulp.dest('app')) 
    ; 

    connect.server({ 
     root: 'app', 
     port: 8081, 
     livereload: true 
    }); 

}); 

//a_services.js

'use strict'; 

angular.module('myServices', []) 
    .factory('MyService', function() { 
     return { 
      myVar:1 
     }; 
    }) 
; 

//b_controllers.js

'use strict'; 

angular.module('myControllers', ['myServices']) 
    .controller('MyController', function ($scope, MyService) { 
     $scope.myVar = MyService.myVar; 
    }) 
; 

// c_app.js

'use strict'; 

angular.module('myApp', ['myControllers']); 

Wynik haustem-inject jest następujący:

<!-- inject:js --> 
<script src="js/c_app.js"></script> 
<script src="js/b_controllers.js"></script> 
<script src="js/a_services.js"></script> 
<!-- endinject --> 

I oczekiwano dokładnie przeciwny, aby uczynić pracę aplikacji (jednak nadal działa). Tak więc, używając plików gulp-angular, sortortuj pliki alfabetycznie, pomimo wszystkich zależności określonych w angular.module (..., [...])

Co się tutaj dzieje?

Answer 1

Właściwie w twoim przypadku nie potrzebujesz gulp-angular-filesort, ponieważ deklarujesz moduł dla każdego pliku. Mechanizm wtrysku zależności dla kątowego wykreśli prawidłowy sposób wywoływania modułów zgodnie z zależnościami.

Będziesz potrzebował gulp-angular-filesort tylko wtedy, gdy masz jeden moduł rozłożony na wiele plików. Tak więc dla przykładu, jeśli wszystkie pliki używają "myApp" jako nazwy modułu. Następnie wtyczka poprawnie sortuje pliki: zawsze z zależnościami przed innymi.

Oto Twój przykład zmodyfikowany tak, że gulp-angular-filesort jest potrzebne:

//a_services.js

'use strict'; 

angular.module('myApp') 
    .factory('MyService', function() { 
     return { 
      myVar:1 
     }; 
    }) 
; 

//b_controllers.js

'use strict'; 

angular.module('myApp') 
    .controller('MyController', function ($scope, MyService) { 
     $scope.myVar = MyService.myVar; 
    }) 
; 

// c_app.JS

'use strict'; 

angular.module('myApp', []); 

W tym przypadku nadal będzie:

1. c_app.js
2. b_controller.js
3. a_service.js

Answer 2

łyk kątowy-filesort przenosi pliki zawierające deklarację modułu nad plikami, w których wymienione są moduły.

Jeżeli moduł wspomniano wcześniej zadeklarował, to masz błędy takie jak:

• „angularjs: 68 Uncaught Błąd: [$ wtryskiwacz: nomod] Moduł 'myApp' nie jest dostępny ! Błędnie wpisałeś nazwę modułu lub zapomniałeś załadować go.Jeśli zarejestrujesz moduł, upewnij się, że określasz zależności jako drugi argument. "

• "angularjs: 13294 Błąd: [ng: areq] Argument 'MyController' nie jest funkcją, dostał nieokreślone"