Sencha Touch - 构建

如今对 Web 应用程序的需求是用更少的开发工作来开发快速的应用程序。Sencha Touch 可以轻松帮助您做到这一点，因为它提供了许多构建库可供选择，基于开发或生产代码以及创建自定义构建的工具。

Sencha Touch 构建库动态加载类。动态加载代表在需要时加载的类，并且仅包含应用程序中需要的那些类。随着要加载的文件数量减少，这使得应用程序运行得更快，同时减少了加载时间。

Sencha Touch 2.x 提供以下五个构建库。

先生。 构建和使用
1

sencha-touchdebug.js

在本地开发应用程序时使用此构建。它是一个非压缩版本，包含所有注释和调试日志，以便在开发时轻松调试。
2

senchatouch.js

该文件用于生产目的。这是我们自定义构建时的缩小版本。
3

sencha-touchall.js

该文件用于生产目的。当我们没有自定义构建时，它是缩小版本。
4

sencha-touchall-debug.js

该文件用于生产中的调试。它没有缩小，并且具有所有注释和调试日志。
5

sencha-touchall-compat.js

此版本用于将版本 1.x 迁移到版本 2.x。只要 1.x 版本代码不兼容且需要修改代码，它就会发出警告。

通过上述构建，Sencha Touch 提供了创建自定义构建的工具。

定制构建的优点

自定义构建不会加载所有触摸文件。它仅加载我们在应用程序中使用的那些文件，这使得应用程序更快且易于维护。

Sencha CMD 用于创建自定义构建。要在 Sencha CMD 中创建自定义构建，请转到应用程序文件所在的目录，然后键入以下命令之一来创建构建。

先生。 命令与使用
1

sencha 应用程序构建本机

构建应用程序并准备一个名为 packager.temp.json 的文件，您可以使用该文件打包应用程序 - packager.temp.json 与 packager.json 相同，但包含其他路径。
2

sencha 应用程序构建-运行本机

构建并自动打包应用程序，并启动适当的模拟器。
3

sencha 应用程序构建包

构建具有打包支持的应用程序，但不配置打包器 JSON 文件。这对于手动维护多个 packager.json 文件的项目非常有用。

构建成功后，它将生成 all-classes.js 文件，我们需要将其包含在 index.html 中以使其做好生产准备。

以下代码显示了要对生产就绪代码进行的更改。

构建应用程序之前的 Index.html

<!DOCTYPE html>
<html>
   <head>
      <link href = "https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/sencha-touch.css" rel = "stylesheet" />
      <script type = "text/javascript" src = "https://cdn.sencha.com/touch/sencha-touch-2.4.2/sencha-touch-debug.js"></script>
      <script type = "text/javascript" src = "app.js"> </script>
   </head>
   <body>
   </body>
</html>

构建应用程序后的 Index.html

<!DOCTYPE html>
<html>
   <head>
      <link href = "https://cdn.sencha.com/touch/sencha-touch-2.4.2/resources/css/sencha-touch.css" rel = "stylesheet" />
      <script type = "text/javascript" src = "https://cdn.sencha.com/touch/sencha-touch-2.4.2/sencha-touch.js"></script>
      <script type = "text/javascript" src = "app.js"> </script>
      <script type = "text/javascript" src = "app-classes.js"> </script>
   </head>
   <body>
   </body>
</html>