我可以在Eclipse中调试AngularJS和TypeScript吗?

Sof*_*ofi 6 eclipse angularjs typescript

我刚开始使用TypEcs,我正在尝试在Typescript和AngularJS中创建一个我想在Eclipse中调试的网页.

  • 是否可以在Eclipse中调试TypeScript和Angular页面?如果是这样,那么请你指导我正确的方向吗?

我尝试使用TypeScript Standalone选项调试单个打字稿文件,它可以正常工作.但我也想使用AngularJS.我已经创建了一个index.html文件和一个app.ts文件,我还将angular.d.ts和angular.min.js等导入到脚本文件夹中.我可以使用任何TypEcs TypeScript调试器来完成此操作吗?我试图运行它,但我在var app = angular.module得到一个错误...(ReferenceError:angular未定义).

我的猜测是我没有加载我在索引文件中链接到的angular.min.js文件.是因为app.ts被设置为TypeScript Standalone配置中的主文件?(我不能选择index.html)和/或我错过了一些代码/设置?

我希望你能帮助我.先感谢您!

以下是一些示例代码:index.html:

<html ng-app="helloworld">
<head>
    <title>Hello World!</title>
</head>

<body>
    <div class="container" ng-controller="HelloWorldCtrl">
        <input type="text" class="form-control" value="{{message}}" />
    </div>
    <script src="../scripts/angular.min.js"></script> 
    <script src="app.js"></script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

app.ts:

/// <reference path="../scripts/typings/angularjs/angular.d.ts"/>
module Sample.HelloWorld {

    export interface IHelloWorldScope extends ng.IScope {
        message: string;
    }

    export class HelloWorldCtrl {

        static $inject = ["$scope"];
        constructor(private scope: IHelloWorldScope) {
            scope.message = "Hello World";
        }
    }

    var app = angular.module("helloworld",["ui.bootstrap"]);
    app.controller("HelloWorldCtrl", HelloWorldCtrl);
}
Run Code Online (Sandbox Code Playgroud)

Sof*_*ofi 4

正如 Basarat 提到的,可以使用 TypEcs 中包含的“TypeScript Web Remote”调试选项来调试 AngularJS 和 TypeScript

页面调试方法:

  1. 关闭所有打开的 Chrome 窗口。
  2. 使用命令 chrome.exe --remote-debugging-port=9222 再次打开 Chrome
  3. 根据 TypEcs / 2.0 中的“为 WebKit 远程模式添加 TypeScript 调试”应用调试配置 - 新增内容和值得注意的内容
  4. 从第 1 点开始在 Chrome 窗口中打开起始页 (index.html)。
  5. 转到调试视图
  6. 使用步骤 3 中的配置进行调试
  7. 将出现一个对话框,您需要在其中选择包含要调试的文件的选项卡。
  8. 现在,您可以单步执行代码并向 app.ts 文件添加断点(如果您愿意)。(如果没有看到步骤选项,请单击主线程)

如果您收到错误“无法获取调试连接超时的选项卡”,请关闭所有 chrome 窗口,然后使用 chrome.exe --remote-debugging-port=9222 命令重新打开 chrome。