为什么 Chrome 在更改时不更新 Typescript 源文件？答案

【问题标题】：Why Chrome doesn't update Typescript source files on change?为什么 Chrome 在更改时不更新 Typescript 源文件？
【发布时间】：2013-09-10 13:52:31
【问题描述】：

我正在使用 Visual Studio 2012 和最新的 Web Essentials 作为 IDE 开发 TypeScript (0.9.1) 项目，并且我使用 Chrome 开发工具进行调试。

最近，很可能在 Chrome 更新之后（当前版本 29.0.1547.66 m），typeScript 文件在我编辑它们后没有得到更新，另一方面相应的编译 js 文件被更新，但似乎不知何故，功能仍然取决于源的未更新版本。

尝试过但失败的解决方案：

重建完整的解决方案。
在 chrome 上硬刷新 (Shift + F5) 本地主机站点
正在删除源映射文件并重新生成它们。

经过一些试验，看起来即使是下载 ts 源文件的请求也会产生未更新的版本（http://localhost:1198/xxx.ts 例如）

似乎在完全重启后问题得到了部分解决（如果重要的话，Windows 8），源文件在 chrome 中更新，但是一旦我再次更改它，就会出现同样的问题。

另一个解决方案是使用隐身，因为它似乎是一个缓存问题。

我的问题：

以这种方式缓存 typeScript 文件是由项目配置中的问题引起的（即使它以前可以工作），还是这是新版本 Chrome 中的错误？

【问题讨论】：

很好奇为什么需要源图。您是否使用--out 选项进行编译？
我实际上并不知道源地图有什么用，但是当我搜索类似的问题时，我得到的只是关于地图无法在 chrome 上运行的问题，所以我只是试了一下.我想我应该考虑阅读源地图：D .
如果您需要从 Chrome (youtube.com/watch?v=RWXGMug_Rmo&hd=1) 或 VisualStudio + IE 调试 TypeScript : (youtube.com/watch?v=TvD_ia7vkkA&hd=1)，它们是必需的，但我发现自己不常用 SourceMaps。除非我将所有 TypeScript 文件合并到一个 JS 中：youtube.com/watch?v=KDrWLMUY0R0&hd=1
我看过你的第一个视频，我认为 VS 会自动完成这项工作，因为我最后得到了相同的结果。
我遇到了同样的问题。所以将stackoverflow.com/questions/11019727/…列为一个相关问题，实际上那里给出的答案也解决了这个问题（至少对我来说，因为我在保持Chrome开发工具打开方面没有问题）。

标签： google-chrome caching visual-studio-2012 typescript google-chrome-devtools

【解决方案1】：

我也遇到了同样的问题。我用 chreome 调试工具禁用缓存检查解决了这个问题。

我的第二个问题，我在同一个文件中写了很多类。我将每个类拼接成单独的文件。

【讨论】：

谢谢萨金！我总是勾选这个框，但由于某种原因，今天没有勾选。 :)
立即修复它。谢谢

【解决方案2】：

我通过手动删除缓存文件解决了这个问题。这可以通过 Chrome 的设置来完成：

点击自定义和控制 Google Chrome - 浏览器窗口右上角的汉堡菜单图标。
选择靠近菜单底部的设置。
向下滚动并点击显示高级设置...链接。
点击清除浏览数据...按钮。
检查缓存的图像和文件。其他复选框可以不选中。
点击清除浏览数据按钮。

网络选项卡中的“禁用缓存”复选框对我不起作用，Ctrl+F5 也不起作用。

【讨论】：

这是唯一对我有用的解决方案。谢谢。
您可以使用“ctrl+alt+del => 缓存的图像和文件”来缩短这些步骤

【解决方案3】：

如果您从 IIS 提供服务，我们已在 web.config 文件中手动禁用缓存：

<system.webServer>

    <httpProtocol>

      <!--TODO: Remove this block for production (//TODO: Remove this block for production) -->
      <customHeaders>
        <!--DISABLE CACHE-->
        <add name="Cache-Control" value="no-cache, no-store, must-revalidate" />
        <add name="Pragma" value="no-cache" />
        <add name="Expires" value="0" />
      </customHeaders>

    </httpProtocol>
</system.webServer>

【讨论】：

我认为这些配置解决了问题，但我很好奇，为什么它没有更新 ts 文件但它更新了 js 文件，是什么让我更加疯狂，为什么它运行非- 更新了 js 文件，即使它正在查看最新版本？
您可以在 chrome 中创建 empty cache and hard reload。但是一遍又一遍地这样做很快就会变得很痛苦。
将该代码放入我的配置文件，以及右键单击刷新（在开发工具打开时），然后“空缓存和硬重新加载”对我有用！

【解决方案4】：

我不知道为什么它不能正常工作。但即使你关闭缓存它仍然不起作用。什么可以作为手动工作。如果 chrome 开发工具已打开，那么您可以右键单击刷新图标并进行硬重新加载（我执行“空缓存和硬重新加载”），它可以工作。

【讨论】：

【解决方案5】：

我像 Jan Aagaard 一样解决了这个问题。

自定义和控制 Google Chrome > 设置 > 显示高级设置... > 清除浏览数据... > 签入“缓存的图像和文件” > 清除浏览数据。

【讨论】：

这个答案和我的有区别吗？

【解决方案6】：

如果有人在安装 ASP.Net 5 RC1 后在 Visual Studio 2015 上遇到同样的问题。检查运行或调试 DNX 项目时浏览器链接仪表板是否显示“无当前连接”，修复更新将解决问题：

关闭 Visual Studio
打开控制面板>程序和功能
右键单击“Microsoft ASP.NET 5 RC1 Update 1”
点击“更改”
在 ASP.NET 5 RC1 Update 1 安装程序中，单击“修复”

【讨论】：

【解决方案7】：

在我们的例子中，我们在 Sources - Page 选项卡上设置了错误的 workspace 目录。
即它指向project-master，但我们实际上是在project-branch中调试

所以解决办法就是设置正确的工作区目录。

【讨论】：