Я новичок в глотке. Я использую VS 2015 Update 3 для своего проекта. Для этого проекта у меня есть несколько классов служб и контроллеров, написанных с использованием TypeScript. Я использую gulp для сортировки, объединения, удаления угловых js-файлов, которые транспилируются файлами .ts. Здесь важен порядок файлов службы и контроллера, поэтому я использую рецепт «gulp-angular-filesort» перед объединением этих файлов. Пробую 2 версии.
Для версии 1 (см. коды ниже. Задача называется "min:appcompExp"), я перечисляю файлы js по порядку явно в файле gulpfile.js, и полученный минимизированный (минимальный) файл имеет вид работает, и нет никаких проблем, когда я запускаю свой проект.
Для версии 2 (см. коды ниже. Задача называется "min:appcompExp2") я использую подстановочные знаки для перечисления имен файлов SOURCE js для сокращения кодов в gulpfile.js. Однако полученный минимизированный (минимальный) файл создается, но он не работает, когда я запускаю свой проект. Ошибка выглядит как проблема с внедрением зависимостей: контроллеры не могут найти соответствующий DI службы, хотя я вижу, что полученный файл min для этой версии содержит все классы службы и контроллера. Я использую ngularFilesort = require("gulp-angular-filesort"), но это не помогает для версии 2.
Одна конкретная ошибка DI с версией 2 с использованием gulp:
Error: $injector:unpr
Unknown Provider
Unknown provider: ContactSrvcProvider <- ContactSrvc <- ContactCtrl
Может кто-нибудь объяснить, почему использование подстановочных знаков для имен файлов SOURCE js не работает с gulp?
Ниже приведен мой gulpfile.js, в котором перечислены 2 версии классов обслуживания и контроллера concat и uglify:
/*
This file in the main entry point for defining Gulp tasks and using Gulp plugins.
Click here to learn more. http://go.microsoft.com/fwlink/?LinkId=518007
*/
var gulp = require("gulp"),
inject = require("gulp-inject"),
concat = require("gulp-concat"),
print = require("gulp-print"),
angularFilesort = require("gulp-angular-filesort"),
uglify = require("gulp-uglify"),
rimraf = require("rimraf");
// concatenated/bundled files
// vendor js scripts
var pathsCssSrc = "./bower_components/bootstrap/dist/css/*.min.css";
var pathsNglibSrc = [
"./bower_components/angular/angular.min.js",
"./bower_components/angular-route/angular-route.min.js",
"./bower_components/jquery/dist/jquery.min.js", // must before "bootstrap.min.js"
"./bower_components/bootstrap/dist/js/bootstrap.min.js"
];
var pathsAppmoduleSrc = [
"./app/app.js",
"./app/Constants/Constants.js",
"./app/routes.js",
"./app/models/*.js"
];
// destinations
var pathsDest = { build: ".build/", subspa : "spa/", indexfile : "./index.html" };
pathsDest.cssDest = pathsDest.build + "css/appStyles.min.css";
pathsDest.nglibDest = pathsDest.build + "nglib/nglib.min.js";
pathsDest.appModuleDest = pathsDest.build + pathsDest.subspa + "app.min.js";
// tasks
....
////// services, controllers
gulp.task("min:appcompExp", function () {
// I explictly list ALL of js file names and their orders of js file names are important.
// The resulted min js file working when I run my project.
var target = gulp.src(pathsDest.indexfile); // important: root folder must be specified before file name "index.html"
var comp = gulp.src([ "app/services/SessionSrvc.js",
"app/services/UtilSrvc.js",
"app/services/BaseSrvc.js",
"app/services/ContactSrvc.js",
"app/services/AvatarSrvc.js",
"app/services/LoginSrvc.js",
"app/services/RegisterSrvc.js",
"app/services/presidentsSrvc.js",
"app/controllers/BaseCtrl.js",
"app/controllers/LoginCtrl.js",
"app/controllers/LogoutCtrl.js",
"app/controllers/RegisterCtrl.js",
"app/controllers/PresidentCtrl.js",
"app/controllers/PresidentDetailCtrl.js",
"app/controllers/ContactCtrl.js",
"app/controllers/AvatarCtrl.js"]);
var dest = ".build/spa/appcomp.min.js";
return target
.pipe(inject(comp
.pipe(print())
.pipe(concat(dest))
.pipe(angularFilesort())
.pipe(uglify()) // Minifies the concatenated js file.
.pipe(gulp.dest(".")) // important: otherwise there is no files stored
, { name: "appcomp" }))
.pipe(gulp.dest("./")); // important: root folder must be specified like so
});
////////////////////////////
gulp.task("min:appcompExp2", function () {
// using wild cards for SOURCE js codes for shorting codes
// I got runtime error when running my project: DI problem - controllers cannot find their service classes.
var target = gulp.src(pathsDest.indexfile); // important: root folder must be specified before file name "index.html"
var comp = gulp.src(["app/services/*.js",
"app/controllers/*.js"]);
var dest = ".build/spa/appcomp.min.js";
return target
.pipe(inject(comp
.pipe(print())
.pipe(concat(dest))
.pipe(angularFilesort()) // this does not help though
.pipe(uglify()) // Minifies the concatenated js file.
.pipe(gulp.dest(".")) // important: otherwise there is no files stored
, { name: "appcomp" }))
.pipe(gulp.dest("./")); // important: root folder must be specified like so
});