1

有人可以幫助我。我在使用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"); 
}; 

enter image description here

回答

2

您已經添加到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。

+1

非常感謝,它的工作原理:D –

+0

請您將其標記爲正確答案。謝謝 –

相關問題