Ошибка: [$injector:modulerr] Не удалось создать экземпляр модуля ngFileUpload

Question

Я использовал NuGet для установки Angular File Upload 12.2.13 и чувствую, что я правильно ввел зависимости, но все еще получаю следующую ошибку:

angular.js: 63 Uncaught Ошибка: [$injector:modulerr] Не удалось создать экземпляр модуля corePower из-за: Ошибка: [$injector:modulerr] Не удалось создать экземпляр модуля ngFileUpload из-за: Ошибка: [$injector:nomod] Модуль 'ngFileUpload' не доступен! Вы либо неправильно написали имя модуля, либо забыли загрузить его. При регистрации модуля убедитесь, что вы указали зависимости в качестве второго аргумента.

Я не получил никаких ошибок при установке и вижу это зарегистрировано в моем решении.

Вот посмотрите на инъекцию в моем модуле приложения:

var corePower = angular.module('corePower', ['ngFileUpload']);

И в контроллере, где я пытаюсь его использовать:

corePower.controller('newComponentController', ['$scope', 'Upload', '$timeout', function ($scope, Upload, $timeout) {
  $scope.uploadPic = function (file) {
    file.upload = Upload.upload({
      url: 'https://angular-file-upload-cors-srv.appspot.com/upload',
      data: { username: $scope.username, file: file },
    });

    file.upload.then(function (response) {
      $timeout(function () {
        file.result = response.data;
      });
    }, function (response) {
      if (response.status > 0)
        $scope.errorMsg = response.status + ': ' + response.data;
    }, function (evt) {
      // Math.min is to fix IE which reports 200% sometimes
      file.progress = Math.min(100, parseInt(100.0 * evt.loaded / evt.total));
    });
  }
}]);

Мне интересно, связано ли это с тем, что мы используем шаблон, в котором используется gulp, и, поскольку я не знаком с gulp, это уже вызвало у меня некоторые головные боли в отношении углов.

Вот посмотрите на наш файл gulp:

    /// <binding BeforeBuild='default' Clean='clean' />
"use strict";

var gulp = require("gulp"),
    rimraf = require("rimraf"),
    concat = require("gulp-concat"),
    cssmin = require("gulp-cssmin"),
    uglify = require("gulp-uglify"),
    less = require("gulp-less"),
    rtlcss = require("gulp-rtlcss");

var paths = { webroot: "./wwwroot/" };
paths.components = paths.webroot + 'components/';

// Sources
paths.js = [
    paths.components + 'app.js',
    paths.components + '**/*.js'
];

//paths.minJs = paths.webroot + "master/js/**/*.min.js";
paths.css = paths.webroot + "css/**/*.css";
//paths.minCss = paths.webroot + "css/**/*.min.css";
paths.less = paths.components + "**/*.less";
paths.lessWatch = paths.less;
// Dests
paths.concatJsDest = paths.webroot + "js";
paths.concatCssDest = paths.webroot + "css";

gulp.task("clean:js", function (cb) {
    rimraf(paths.concatJsDest, cb);
});

gulp.task("clean:css", function (cb) {
    rimraf(paths.concatCssDest, cb);
});

gulp.task("clean", ["clean:js", "clean:css"]);

gulp.task("min:js", function () {
    return gulp.src(paths.js)
        .pipe(concat('app.js'))
        //.pipe(uglify())
        .pipe(gulp.dest(paths.concatJsDest));
});
// ew
gulp.task('js:watch', function () {
    gulp.watch(paths.js, ['min:js']);
});

gulp.task('less:app', function () {
    gulp.src(paths.less)
        .pipe(less())
        .on('error', function (err) {
            console.log(err);
        })
        .pipe(concat('app.css'))
        .pipe(gulp.dest(paths.concatCssDest));
});

gulp.task('less:watch', function () {
    gulp.watch(paths.lessWatch, ['less']);
});

gulp.task('less', ['less:app']);

gulp.task('rtl', function () {
    gulp.src(paths.css)
        .pipe(rtlcss())
        .pipe(gulp.dest(paths.concatCssDest));
});

gulp.task("min:css", ["less"], function () {
    gulp.src(paths.css)
        .pipe(cssmin())
        .pipe(gulp.dest(paths.concatCssDest));
});

gulp.task("min", ['min:css', 'min:js']);

gulp.task("watch", ['less:watch', 'js:watch']);

gulp.task("default", ["min:js", "less"]);

Обратите внимание, что я отключил uglification в нашем js minification, так как это вызывало некоторые проблемы.

        gulp.task("min:js", function () {
    return gulp.src(paths.js)
        .pipe(concat('app.js'))
        //.pipe(uglify())
        .pipe(gulp.dest(paths.concatJsDest));
});

Также можно быстро взглянуть на мои зависимости решения Visual Studio 2017 на случай, если это поможет

Очень ценю любой совет!

Answer 1

Ты добавил .js файл в index.html

<script src="ng-file-upload.min.js"></script>