1

如果您可以使用调试信息编译主题，Chrome Canary 提供了一些出色的 SASS 检查器功能。我已经弄清楚如何在通用 Compass 样式表中使用以下行：sass_options = { :debug_info=>true }，但是 EXT JS 的构建过程（无论看起来如何）总是编译压缩的 SASS 文件。他们的“测试”命令可以扩展这个文件，但我仍然需要@media 标签（或调试信息）才能让 SASS 检查器工作。

有谁知道如何更改 Sencha EXT JS 主题构建过程以添加调试信息以支持 Canary？或者有谁知道build.css.preprocessor.opts.productionbuild.properties 中可能有什么关系？

4

3 回答 3

1

所以我现在有了这个工作，它没有我想要的那么好，因为 Ext-JS 有大量的 mixins 和其他导入。然而，这里是如何让它工作。

系统设置（此处的版本很重要，因为 Chrome 27+ 仅支持某种类型的源映射）：
Ext-JS 4.2.1
SASS (3.3.0.alpha.149)
Compass (0.12.2)

建立之后，转到您的主题包并运行sencha package build. 这或多或少会在您的主题包中构建一个 /build 文件夹。此构建还将生成一个{theme-name}-all.scss包含所有其他混入和需要独立编译的包含，这是至关重要的！

完成后，您可以运行以下内容：
sass --compass --sourcemap {theme-name}-all.scss:resources/{theme-name}-all.css

显然更改这些以适应您的环境。这将做的是在 /resources 目录（应该在那里）中构建一个已编译的 css 文件，并且在其中编译所有图像和其他资源相对链接到您的样式表是很重要的。

从那里我更改了 index.html（应该在您的应用程序的根目录中）以指向这个新生成的 css 文件。还需要设置 Chrome 以使用此信息，但这不在此问题范围内。

希望这对其他人有帮助。这确实是一个混合包，因为 Sencha 中涉及的主题有很多事情要做。希望随着时间的推移，这会变得更好。

于 2013-06-21T22:27:39.723 回答
1

尝试通过以下方式切换模式：

sencha package build development // or `build debug`

至于build.css.preprocessor.opts.production，绝对可以使用（检查sencha test）：

build.options=logger:${build.options.logger},
debug:${build.options.debug},
product:${build.options.product},
minVersion:${build.options.minVersion},
${build.options.default},
${build.options.custom}
于 2017-06-07T05:11:40.880 回答
0

如果您正在寻找免费的煎茶主题或煎茶主题构建器，这里是一个很棒的网站

http://developerextensions.com/index.php/sencha-theme-builder

于 2013-07-10T05:56:13.117 回答