Visual Studio 2017的Typescript支持

Question

我最近一直在尝试学习TypeScript，在使用.ts文件安装“Web Essentials”扩展程序后，我一直在观看的一些视频中，visual studio为您提供了一个预览面板，因此您可以将JavaScript视为你输入。

这些视频似乎正在使用VS 2012。

但是，在VS 2017上安装Web Essentials似乎没有这个选项，有谁知道如何在VS 2017中使用它？它对TypeScript有相同的支持吗？

Answer 1

所以TypeScript默认安装在VS2017上（Update 2将为您提供最新版本的2.3并允许并排安装）。如果您没有它，可以通过Visual Studio Installer添加它 - 从安装程序中单击汉堡菜单并选择Modify，然后单击Individual Components，在SDKs，Libraries and Frameworks下可以添加TypeScript。

安装完成后，您可以添加一个tsconfig.json文件来告诉TypeScript编译器如何操作，例如：

{
    "compileOnSave": true,
    "compilerOptions":
    {
        "noImplicitAny": false,
        "noEmitOnError": true,
        "removeComments": false,
        "sourceMap": true,
        "target": "es5"
    },
    "exclude":
    [
        "node_modules"
    ]
}

重要的设置是compileOnSave，它告诉VS在保存ts时编译js文件。

您现在应该在TypeScript文件中看到嵌套的Javascript文件：

现在你只需要并排打开这两个文件，当你保存ts时，js会自动更新（如果VS提示你在磁盘上加载更改的文件，它有助于勾选总是更新选项）。

Answer 2

我看到你的问题是VS 2017，我在VS 2017上没有找到任何文件来确认它是否已被添加回来。但是，我确实发现这在VS 2015中已被删除。请参阅Github上的此链接

由于在新版本发布时与TS编译器发生冲突，TS预览窗格已从Web Essentials 2015中删除。 TS团队已经意识到这一点，我希望他们将来可以将这个功能添加到TS工具中。当实现预览窗格时，此功能可能会包含在全新的Web编译器扩展（https://visualstudiogallery.msdn.microsoft.com/3b329021-cd7a-4a01-86fc-714c2d05bb6c）中。

Answer 3

我有一个解决方法，这是一些工作，但有助于奇怪的场合，当我想检查输出。

我正在运行vs2017我已经安装了web essentials和web编译器，但是从15.4开始它似乎仍然不支持ts并且我无法使tsconfig.json工作。

简要显示项目中的隐藏文件并选择相应的js文件，然后将选项卡向右拖动，这样就可以分割屏幕了解qqxswpoi

当您更改并保存ts文件时，您可能会弹出一个“文件已更改”或类似内容的弹出窗口，您可以在其中选中一个复选框，其中显示“如果未检测到更改则自动恢复”（同样我可能是释义，我试图找到选项，所以我可以重置它以获取截图，但我找不到它！），检查，然后选择“是全部”这刷新js文件。下次更改ts文件时，js文件将更新。

我知道它不是很好，但我发现它非常有用，因为我可以得到你在阅读课程时所看到的内容，并且他们会继续显示javascript的预览。

Answer 4

在Visual Studio 2017中，您需要在安装过程中安装“Node.js development”工作负载，或者在“新建项目”对话框中修改现有安装，方法是单击“找不到您要查找的内容？打开Visual Studio Installer”链接。

然后File> New> Project ...将在Installed类别下包含Javascript和Typescript项目模板。

Answer 5

我已经安装了web essentials 2017，但不确定这是否是强制性的。问题是如何在VS 2017中并排打开两个文件;特别是一个打字稿及其对应的js文件。

您可以并排打开任意两个文件，步骤如下。

首先在解决方案资源管理器中双击它们，打开有问题的两个文件。

接下来，将光标放在上面突出显示的红色框上，然后将该Car.js文件选项卡向下拖动。

现在你看到五个小方块，用红色方框突出显示。将光标移动到4个外部小方块中的任何一个上。我将光标放在右边，如下所示。

你去吧

我想这可以在没有网络必需品的情况下运行，并且是一个功能。让我知道你是否可以在没有安装网络必需品的情况下做到这一点。