在 Sencha Touch 2 中加载外部 javascript 的正确方法是什么答案

【问题标题】：What is the proper way to load an external javascript in Sencha Touch 2在 Sencha Touch 2 中加载外部 javascript 的正确方法是什么
【发布时间】：2012-05-07 06:32:42
【问题描述】：

在我的开发中，我需要包含第三方 javascripts；像money.js (http://josscrowcroft.github.com/money.js/)

实现它的最佳“干净”/“正确”方法是什么？只需将其包含在 index.html 中即可？

【问题讨论】：

标签： sencha-touch sencha-touch-2

【解决方案1】：

没有。不要直接在index.html 文件中添加额外的javascript 文件。这不是推荐的方式（虽然它可能有效）。

相反，这样做，

在您的index.html 中包含以下行。 microloader是sencha sdk自带的文件夹，主要包含三个文件，development.js、production.js和testing.js，各有各的用途。

然后，在您的<appname> 文件夹中，您需要有一个名为app.json 的文件。它看起来像这样..

{
    "name": "Sencha",

     // All javascript files go here ...
    "js": [
        {
            "path": "../../sencha-touch-all-debug.js"
        },
        {
            "path": "app.js",
            "update": "delta"
        },
        { 
            "path": "http://josscrowcroft.github.com/money.js/",
            "update": "delta"  
        }
    ],
    "css": [
        {
            "path": "../../resources/css/sencha-touch.css",
            "update": "delta"
        },
        {
            "path": "resources/css/app.css",
            "update": "delta"
        }
    ],

    .....
    .....
    .....
 }

【讨论】：

有效的解决方案……我在测试/生产版本中都试过了；它没有被加载:(
尝试直接写在index.html。当涉及到使用一些本地附加 js 文件时，上述解决方案对我来说非常适合。
嗯..加载外部 javascript 文件在 index.html 中工作。可能这就是为什么我们需要在 index.html 中编写以下脚本 <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY&sensor=true"></script> 以在我们的应用程序中使用 Google 地图。无论如何，不客气:-)
将它放在 index.html 中会起作用，但它会减慢启动加载时间，因为它必须立即加载脚本。按照 roadRunner 的建议进行操作具有延迟加载的优势（我认为？？）
对这个问题有任何想法吗？ stackoverflow.com/questions/14507760/…

【解决方案2】：

如果您使用 Sencha Cmd，您的 index.html 可能如下所示：

<!-- The line below must be kept intact for Sencha Command to build your application -->
<script id="microloader" type="text/javascript" src=".sencha/app/microloader/development.js"></script>

因此，在更改 app.json 后，您需要刷新您的应用：

sencha app refresh

【讨论】：

@99tm 提供的解决方案是正确的，但是这是使用 Sencha Cmd 的必要步骤。
+1 我正在使用的教程完全忘了提及这一点。谢谢。

【解决方案3】：

纯 javascript 为我解决了问题。我只是在启动函数中包含了这段代码：

var scriptTag = document.createElement('script');
scriptTag.src = 'specify the path here...';
document.body.appendChild(scriptTag);

scriptTag 被附加到索引文件的正文中。

【讨论】：

【解决方案4】：

如果外部 JavaScript 库是本地的，则以下内容适用于 Ext JS 5.0.0。编辑完成后，运行“sencha app build”

对 app.json 中的三个 JSON 元素进行更改。 (1).js （2）CSS (3) 资源

{
    "name": "Sencha",

     // All javascript files go here ...
"js": [
    {
        "path": "app.js",
        "bundle": true
    },
    {
        "path": "leaflet/leaflet.js",
        "bundle": true
    }
],
"css": [
    {
        "path": "bootstrap.css",
        "bootstrap": true
    },
    {
        "path": "leaflet/leaflet.css",
        "bootstrap": true
    }
],

    .....
/**
 * Extra resources to be copied along when build
 */
"resources": [""leaflet/leaflet.js","leaflet/leaflet.css"

], ...... ...... }

【讨论】：