Typescripts - Uncaught ReferenceError:toastr is not defined
问题描述:
有人可以帮助我。我在使用Microsoft Visual Studio 2015的TypeScripts中做了一个简单的项目,我在git仓库中添加了2个“toastr”和“jquery”库:https://github.com/DefinitelyTyped/DefinitelyTyped。一旦添加,Visual Studio根本不会显示错误或警告(如图片Visual Studio Screen)。但是当我运行该应用程序时,这是我收到的:Uncaught ReferenceError:toastr未定义。Typescripts - Uncaught ReferenceError:toastr is not defined
...和index.html的:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>TypeScript HTML App</title>
<link rel="stylesheet" href="app.css" type="text/css" />
<script src="app.js"></script>
</head>
<body>
<h1>TypeScript HTML App</h1>
<div id="content"></div>
</body>
</html>
app.ts:
/// <reference path="toastr.d.ts" />
class Greeter {
element: HTMLElement;
span: HTMLElement;
timerToken: number;
constructor(element: HTMLElement) {
this.element = element;
this.element.innerHTML += "The time is: ";
this.span = document.createElement('span');
this.element.appendChild(this.span);
this.span.innerText = new Date().toUTCString();
}
start() {
this.timerToken = setInterval(() => this.span.innerHTML = new Date().toUTCString(), 500);
}
stop() {
clearTimeout(this.timerToken);
}
}
window.onload =() => {
var el = document.getElementById('content');
var greeter = new Greeter(el);
greeter.start();
toastr.info("ASDFGH");
};
答
您已经添加到toastr类型定义引用但是你的天堂”实际上引用了toastr或jquery js库。 因此,将toastr.js和css文件添加到您的html(更多信息,请参阅https://github.com/CodeSeven/toastr)。 例如在头元件:
<link href="build/toastr.min.css" rel="stylesheet" type="text/css">
然后是内容后
<script src="build/toastr.min.js"></script>
在本例中的HTML看看,给你的,应该loook什么样的更好的主意: http://codeseven.github.io/toastr/demo.html
所以,只是为了澄清:* .d.ts文件只是简单地告诉TypeScript编译器有关您引用的外部文件(用于设计时编译)中的类型。他们实际上并没有在运行时拉入任何js。
非常感谢,它的工作原理:D –
请您将其标记为正确答案。谢谢 –