0

我遵循了 Angular2 中社交应用程序的 angular-meteor 教程。它基本上可以工作（经过几个手动步骤来修复包依赖项等），但是，我无法在 Chrome 开发工具中调试客户端代码。当我导航到我的 *.ts 文件的源时，我看到的只是类似的东西

module.export("default",exports.default=("<div> <ul> <li *ngFor=\"let party of parties\"> {{party.name}} <p>{{party.description}}</p> <p>{{party.location}}</p> </li> </ul> </div>"));

开发工具中的其他奇怪的东西：我的 app.ts 是空白的。我看到带有 !raw 后缀的 html 文件......（例如 app.html!raw）。什么是 !raw 后缀，是什么原因造成的？ 在此处输入图像描述

如何调试我的打字稿？

4

1 回答 1

1

我也许可以帮助您解决问题的某些部分。

您没有提及您使用的是哪个版本的流星，但我假设版本为 1.4 或 1.4.0.1。我已经看到这些版本的 Meteor 似乎在 Typescript 文件的源映射方面存在问题（可能是因为它们必须经过多个转译步骤）。我还不知道错误的确切位置（Meteor 或 Typescript 编译器包）。这是一个 github 问题：https ://github.com/barbatus/typescript/issues/23

更新：此问题现已修复。

目前，我的建议是尝试恢复到 Meteor 的 1.3.xx 版本。对于类似社交教程，最简单的选择是在创建时指定 Meteor 版本：

$ meteor create --release 1.3.5.1 Socially

（发布列表位于：https ://github.com/meteor/meteor/releases ）

'app.html' 和 'app.html!raw' 文件是由流星角度编译器生成的，作为解决使用 templateUrl 和流星构建过程的问题的一种方式。我的理解是，首选的方法是使用内联模板或像这样导入模板：

// This import loads the content of the html file into 'template'
import template from './app.html';

@Component({
  selector: 'app',
  // Instead of templateUrl, use:
  template,      // <--- 'template,' is syntactic sugar for: 'template: template,'
  directives ... etc.

import 语句有点不寻常，这个魔法是通过流星角度预编译器实现的，它将每个 html 和 css 文件转换为几个 js 文件。这就是奇怪的app.html和app.html!raw是什么。

第一个应用程序文件夹中的有趣字符似乎是一个错误。Meteor 尝试在计算机中生成表情符号，但有时处理不正确。我不确定这是 Chrome、ChromeDevTools 还是 Meteor 的错误。（就个人而言，我希望他们放弃表情符号）。

于 2016-08-10T20:53:41.410 回答