Javascript 角度2:承诺拒绝:未定义alertify

Javascript 角度2:承诺拒绝:未定义alertify,javascript,angular,typescript,angular-promise,alertify,Javascript,Angular,Typescript,Angular Promise,Alertify,我正在尝试使此()教程/示例单页应用程序在我的计算机上运行(Visual Studio 2015,Win 7 Prof,Chrome浏览器),并在尝试打开相册页面时在浏览器控制台中出现以下运行时错误: platform-browser.umd.js:937 Error: Uncaught (in promise): ReferenceError: alertify is not defined at resolvePromise (zone.js:558) at zone.js:535 at Z

我正在尝试使此()教程/示例单页应用程序在我的计算机上运行(Visual Studio 2015,Win 7 Prof,Chrome浏览器),并在尝试打开相册页面时在浏览器控制台中出现以下运行时错误:

platform-browser.umd.js:937 Error: Uncaught (in promise): ReferenceError: alertify is not defined
at resolvePromise (zone.js:558)
at zone.js:535
at ZoneDelegate.invoke (zone.js:332)
at Object.onInvoke (core.umd.js:9245)
at ZoneDelegate.invoke (zone.js:331)
at Zone.run (zone.js:225)
at zone.js:591
at ZoneDelegate.invokeTask (zone.js:365)
at Object.onInvokeTask (core.umd.js:9236)
at ZoneDelegate.invokeTask (zone.js:364)BrowserDomAdapter.logError @ platform-browser.umd.js:937ExceptionHandler.call @ core.umd.js:4392next @ core.umd.js:9971schedulerFn @ core.umd.js:9168SafeSubscriber.__tryOrUnsub @ Subscriber.ts:240SafeSubscriber.next @ Subscriber.ts:192Subscriber._next @ Subscriber.ts:133Subscriber.next @ Subscriber.ts:93Subject._finalNext @ Subject.ts:154Subject._next @ Subject.ts:144Subject.next @ Subject.ts:90EventEmitter.emit @ core.umd.js:9156onError @ core.umd.js:9394onHandleError @ core.umd.js:9266ZoneDelegate.handleError @ zone.js:336Zone.runGuarded @ zone.js:242_loop_1 @ zone.js:508drainMicroTaskQueue @ zone.js:515ZoneTask.invoke @ zone.js:437

zone.js:484 Unhandled Promise rejection: alertify is not defined ; Zone: angular ; Task: Promise.then ; Value: ReferenceError: alertify is not defined(…) ReferenceError: alertify is not defined
    at new NotificationService (http://localhost:9823/lib/spa/core/services/notificationService.js:14:26)
    at AppView._View_Albums_Host0.createInternal (Albums.ngfactory.js:15:35)
    at AppView.create (http://localhost:9823/node_modules/@angular/core//bundles/core.umd.js:12439:25)
    at ComponentFactory.create (http://localhost:9823/node_modules/@angular/core//bundles/core.umd.js:9047:40)
    at ViewContainerRef_.createComponent (http://localhost:9823/node_modules/@angular/core//bundles/core.umd.js:8354:49)
    at eval (http://localhost:9823/node_modules/@angular/core//bundles/core.umd.js:10295:33)
    at ZoneDelegate.invoke (http://localhost:9823/node_modules/zone.js/dist/zone.js:332:29)
    at Object.onInvoke (http://localhost:9823/node_modules/@angular/core//bundles/core.umd.js:9245:45)
    at ZoneDelegate.invoke (http://localhost:9823/node_modules/zone.js/dist/zone.js:331:35)
    at Zone.run (http://localhost:9823/node_modules/zone.js/dist/zone.js:225:44)
notificationService.ts有问题。请注意,这在类外部声明alertify以避免编译时通知:

import { Injectable } from '@angular/core';

declare var alertify: any;

@Injectable()
export class NotificationService {
    private _notifier: any = alertify;

    // irrelevant other code
}
已生成notificationService.js。似乎没有与“declare var alertify:any;”对应的内容。可能还可以,因为alertify是一个外部JavaScript库,但仍然很奇特:

"use strict";
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
    return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (this && this.__metadata) || function (k, v) {
    if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
var core_1 = require('@angular/core');
var NotificationService = (function () {
    function NotificationService() {
        this._notifier = alertify;

    // irrelevant other code
}());
运行cmd“NPM install”时,更改NPM的package.json中的版本也会失败:

有什么不对劲吗?我对所有这些材料都很陌生,所以任何关于发生了什么的解释都会很有帮助


更新:将从下载的.js和.css文件添加到wwwroot/lib文件夹,并更新index.cshtml中的样式表引用,可以阻止出现错误,并使通知框显示得非常漂亮。我觉得这仍然是一个次优的解决方案,因为这种方法需要我手动更新alertify文件,而不是充分利用bower和NPM的潜力。如果您有关于如何改进此解决方案的建议,请告诉我。

我也看过该教程,我的问题是alertify已停止,因此即使bower认识到它,也无法下载.js文件。你应该使用google alertify.js,手动下载脚本并将其放入你的应用程序将要查找的文件夹中。这为我解决了问题

另外,在您熟悉所有事情如何协同工作之前(尤其是在VS中的工具改进之前),我建议使用VS代码。使用它可以更轻松地启动和运行教程。

Bower下载alertify.js很好。NRade,我不明白你为什么

bower alertify.js#1.0.12  ENORESTARGET No tag found that was able to satisfy     1.0.12
回购协议使用0.3.11版本。在测试文件夹中创建以下bower.json文件并运行bower安装

{
    "name": "ASP.NET",
    "private": true,
    "dependencies": {
        "alertify.js": "0.3.11"
    }
}
您应该下载alertify.js,如图所示
关联的gulp请确保将alertify.js复制到正确的位置。

您知道应用程序希望alertify.js文件准确地出现在哪里吗?我试着把它放在wwwroot、/app文件夹、/app/core/services文件夹(notificationService所在的位置)、bower\u components/alertify.js和node\u模块/alertifyjs中。似乎没有任何效果。我使用的文件似乎也是它的更新版本(1.8.0)。我将角度文件放在了wwwroot\lib\js和wwwroot\lib\css中,这似乎阻止了错误的出现。看起来通知框出现了,但是它的布局非常扭曲。我将在主帖子中添加一个屏幕截图。当我将bower.json中的版本更改为1.0.12以尝试使其与NPM中的alertify版本匹配时,我会出现该错误。当我把“0.3.11”作为版本,我首先得到错误“无效元”的“名称”建议是小写,可以包含数字,点,破折号。当我将“name”更改为“asp.net”时,此错误消失,cmd“bower安装”成功,没有任何结果通知。在bower_components\alertify.js中,没有出现js文件。只有一个名为“.bower”的文件和一个名为“README.md”的文件。这似乎是我们得到不同结果的地方。我在运行“bower install alertifyjs#0.3.11”时确实得到了这些文件
bower alertify.js#1.0.12  ENORESTARGET No tag found that was able to satisfy     1.0.12
{
    "name": "ASP.NET",
    "private": true,
    "dependencies": {
        "alertify.js": "0.3.11"
    }
}