TypeScript中的內部模塊：undefined error

我是TypeScript中的新手，我想使用多個文件作爲我的代碼，使用TypeScript 0.9.0版和Visual Studio。我認爲我做了正確的代碼，IntelliSense似乎也這麼認爲，但是當我真正運行它時，它會拋出JavaScript未定義的異常。TypeScript中的內部模塊：undefined error

我有兩個.ts文件，它們是app.ts和module.ts，這是我的短代碼。

module.ts是在這裏：

module Shapes { 
    export class Rectangle { 
     constructor(
      public height: number, 
      public width: number) { 
     } 
    } 
}

和app.ts在這裏：

/// <reference path="app/classes/module.ts" /> 
var rect = new Shapes.Rectangle(10, 4);

智能感知正確檢測什麼是 '形狀'，什麼是 'Shapes.Rectangle'，但是當我運行這個代碼，錯誤說'形狀'是未定義的。

所以我搜索了網頁，發現一些文章，包括this和this，我跟着他們的提示，但是我失敗了。我不明白爲什麼...

這是我的default.htm代碼。

<!DOCTYPE html> 

<html lang="en" xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <meta charset="utf-8" /> 
    <title>TypeScript HTML App</title> 
    <link rel="stylesheet" href="app.css" type="text/css" /> 

    <script src="app/classes/module.js"></script> 
    <script src="app.js"></script> 
</head> 
<body> 
    <h1>TypeScript HTML App</h1> 

    <div id="content"></div> 
</body> 
</html>

我想我正確地將module.js添加到HTML文件。誰能幫我？

來源

2013-06-26 Kagami Sascha Rosylight

看起來好像沒什麼問題。如果你打開你的.js文件，你能否確認打印文件是否正確編譯？ – rob

另外你如何運行你的應用程序？如果您只需雙擊index.htm文件，它是否工作？如果你從VS運行，你可能需要再次檢查工作目錄是否正確設置。 – rob

這真的很好！我遵循Jeffry Grajkowski的例子，它工作，所以我認爲目錄設置正確。 –

我認爲你的問題很可能是module.js實際上並沒有被加載。大多數瀏覽器都包含一些用於查看網絡流量的調試工具，但我更喜歡Fiddler。它獨立於瀏覽器，功能非常強大。

由於您使用的是內部模塊（我們也選擇了這個模塊），您可能需要考慮將源文件編譯爲單個文件。它減少了網絡流量，保持文件系統整潔，HTML文件更簡單。爲此，請在文本編輯器中打開csproj文件，查找PropertyGroups，其中包括<TypeScriptTarget>並添加<TypeScriptOutFile>outputfile.js</TypeScriptOutFile>，其中outputfile.js是要生成的文件的名稱。

這是我作爲一個例子：

<PropertyGroup Condition="'$(Configuration)' == 'Debug'"> 
    <TypeScriptTarget>ES3</TypeScriptTarget> 
    <TypeScriptIncludeComments>true</TypeScriptIncludeComments> 
    <TypeScriptSourceMap>true</TypeScriptSourceMap> 
    <TypeScriptOutFile>out.js</TypeScriptOutFile> 
    <TypeScriptGeneratesDeclarations>true</TypeScriptGeneratesDeclarations> 
    </PropertyGroup> 
    <PropertyGroup Condition="'$(Configuration)' == 'Release'"> 
    <TypeScriptTarget>ES3</TypeScriptTarget> 
    <TypeScriptIncludeComments>false</TypeScriptIncludeComments> 
    <TypeScriptSourceMap>false</TypeScriptSourceMap> 
    <TypeScriptOutFile>out.js</TypeScriptOutFile> 
    <TypeScriptGeneratesDeclarations>false</TypeScriptGeneratesDeclarations> 
    </PropertyGroup>

來源

2013-06-26 17:41:04

謝謝，現在它正常工作！：d –

TypeScript中的內部模塊：undefined error

回答

相關問題