css - IE10 和 Chrome 的 Sencha Touch 生产构建问题

Question

我遇到了基于 Sencha Touch 的应用程序的生产构建版本无法在 IE10 和 Chrome 中正确应用样式的问题。

重现步骤:

主要.js

Ext.define('Lab.view.Main', {
extend: 'Ext.Panel',
xtype: 'main',
requires: [

],
config: {
tabBarPosition: 'bottom',

items: [

{
xtype: 'panel',
cls: 'MyFirstLogo',
itemId: 'firstLogo'
} ]
}
});

SCSS 文件 - app.scss

.MyFirstLogo{
height: auto !important;
min-height: 100px;
min-width: 404px;
padding: 0px;
background-image:url(../../resources/images/test1.jpeg);
background-repeat:no-repeat;
background-position: left;
}

1. 确保背景图像 URL 在 resources/sass/app.scss - ../../resources/images/test1.jpeg 中是这样的。

2. 在元素根目录 (Lab/) 中运行“sencha app build production”

3. 在 IE10 64 位 (Win 7) 中访问应用程序:http://localhost/lab/build/production/Lab/

4. 图像在 IE10 中根本不显示。但是，在 Chrome 中尝试这个时效果很好。 Chrome 以某种方式能够将 ../../resources/images/test1.jpeg 转换为 http://localhost/lab/build/production/Lab/resources/images/test1 .jpeg 但 IE10 不这样做并且无法显示图像。这样它也可以在我的本地开发环境中工作，因为它符合我的元素结构。

5. 为了使其在 IE10 中工作，我已将图像 URL 从 ../../resources/images/test1.jpeg 更改为 resources/images/resources/sass/app.scss 中的 test1.jpeg (这实际上是有意义的，因为 resources/目录位于元素根目录中)并为生产重建它。在这种情况下，图像开始出现在 IE10 中，但现在当我使用 Chrome 时 - 图像不显示并且 Chrome 正在尝试从此不正确的 URL 检索图像:http://localhost/lab/build/production/Lab/resources/css/resources/images/test1.jpeg，它失败了。这样它也不能在我的本地开发环境中工作。

6. 此问题发生在其他资源以及“字体”等资源上。

能否请您帮助我了解 Sencha 的生产构建版本不能同时在 IE10 和 Chrome 中运行是怎么回事？这是 Sencha Touch 或 Chrome 的错误，还是我在这里遗漏了什么？

Answer 1

经 Sencha 人员确认，这是 Sencha Touch 中的已知错误。检查此链接:http://www.sencha.com/forum/showthread.php?266275 .感谢@peter 和@arthurakay 的帮助。如果我需要解决方法或对此进行进一步讨论。我将重新开始讨论。谢谢大家!