禁用 Sencha 脚本加载器缓存破坏，但仅限于 developing/debugging

Question

我正在使用 ExtJS 4.x 和 Sencha Architect 2.2 但这应该与更高版本和任何使用 Ext.Loader class 动态加载脚本的应用程序相关，包括Sencha Touch.

默认情况下 Ext.Loader 添加 ?_dc=... 缓存清除参数以确保将每个脚本的最新版本加载到浏览器中。当部署到生产或测试环境时，这是一件好事，因为它确保 user/tester 每次部署和更新时都获得最新的脚本，但对于开发环境，这并不是真正必要的，因为开发人员知道使用浏览器技术，如 ctrl+F5 强制重新加载所有脚本。更重要的是，当您在浏览器中重新加载应用程序时，缓存破坏会妨碍调试，因为断点等会丢失。

通过在 Ext.Loader 配置中将 disableCaching 设置为 false 来禁用缓存清除。例如：

Ext.Loader.setConfig({
    enabled: true,
    disableCaching: false
});

在此代码段中，启用了动态加载，禁用了缓存无效化。然而，还有其他配置选项，如 API 文档 here.

中所述

在 Sencha Architect 中，此代码是在 app.js 中为您生成的，您无法编辑它。 Architect 有一个 "Project Setting" 来启用缓存，但在 2.2 版本中它不适用于 ExtJS 4。我假设它在以后的版本中工作正常但它似乎是全有或全无所以你必须记住切换它关闭并重建以部署到非开发环境。

我想要的是能够：

解决 Architect 2.2 版中的设置错误
在 "production" 中启用缓存清除，但在开发中不启用重建我的应用程序

Answer 1

Ext.Loader.setConfig()可以调用多次，设置不同，设置一起"merged"。对我来说，这在 documentation but fortunately it was more obvious in the source code.

中还不清楚

源代码还显示有一个未记录的 setConfig 形式，它采用 name 和 value 代替的配置对象，但由于它没有记录，我会坚持传递这样的对象：

Ext.Loader.setConfig({disableCaching: false});

知道这不会影响其他 Ext.Loader 在您的应用程序其他地方设置的配置，您可以将此代码 任何地方 在加载 Ext 之后，但在Ext.onReady() 被调用。在 Sencha Architect 中，这可以通过将其放入 "JS Resource" 中来实现，如 here.

所述

这解决了我问题的第一部分，但我还希望能够在不重建的情况下关闭缓存破坏，因此我修改了代码以检查 "debug" URL参数如下：

if (Ext.Object.fromQueryString(document.location.search).debug) {
    Ext.Loader.setConfig({disableCaching: false});
}

现在，当我想调试我的应用程序时，我可以使用如下所示的 URL：

http://myhost/.../app.html?debug=true

并且缓存清除已关闭。我只是省略了 debug 参数以使其重新打开。

Answer 2

如果您使用的是 Sencha Command，您可以换行以在调试块中禁用缓存无效化，位于 app.js

开头的某处

// <debug>
Ext.Loader.setConfig({disableCaching: true});
// </debug>

现在，在为生产构建时将删除代码。如果您想要（或需要），您还可以为测试版本配置构建属性以保留调试代码。

禁用 Sencha 脚本加载器缓存破坏，但仅限于 developing/debugging

Disable Sencha script loader cache busting but only while developing/debugging

extjs

sencha-touch

extjs4

sencha-architect