5

Sencha のMVC アプリケーション アーキテクチャ ガイドのファイル構造セクションに基づいて新しい Ext JS 4.1.1 アプリを作成すると、次のような構造になります。

/wwwroot
    /myapplication
        /app
            /controller
            /view
        app.js
    /extjs-4.1.1

app.js ファイルには以下が含まれます。

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

Ext.application({
    appFolder: '/myapplication/app',
    autoCreateViewport: true,
    name: 'MyApplication',
    controllers: [
        ...
    ]
});

大丈夫だ。次に、出力する app.js をサーバー側のMVC アプリケーションに含めます (クライアント側のExt JS MVC 構造と混同しないでください)。この質問では、使用される言語とサーバー側アプリケーションの構造は重要ではありませんが、出力の結果は重要です。開発中のアプリケーションの URL は次のとおりです。

http://servername/someidentifier1/someidentifier2

多くのアプリケーションと同様に、mod_rewrite は識別子に意味を与え、URL をサーバー側のコードにマップするために使用されます。これらの識別子は、「物理」ディレクトリにはマップされません。この URL の出力は次のとおりです。

<!DOCTYPE html>
<html>
<head>
<title>MyApplication</title>
<link href="/extjs-4.1.1/resources/css/ext-all-debug.css" media="screen" rel="stylesheet" type="text/css" >
<script type="text/javascript" src="/extjs-4.1.1/ext-debug.js"></script>
<script type="text/javascript" src="/myapplication/app.js"></script>
</head>
<body>
</body>
</html>

Ext JS は、推奨されるデフォルトの場所 (/wwwroot/myapplication/extjs-4.1.1) ではなく、複数のアプリケーション間で共有されるため、1 レベル上にあります。上記の app.js を振り返ってみると、「存在しない」URL で機能させるために設定する必要がある appFolder 設定にも気付くでしょう。

開発中はこれで問題なく動作しますが、次のステップは、 Sencha SDK Toolsを使用してコードの「ビルド」を生成することです(質問は Windows のバージョン 2.0.0 Beta 3 に基づいています)。これが間違っているところです。次の手順を実行します。

  1. コマンド ライン /wwwroot/myapplication ディレクトリに移動します。
  2. sencha create jsb -a http://servername/someidentifier1/someidentifier2 -p myapplication.jsb3jsb3 ファイルを生成するために実行します。
  3. 私は実行しますsencha build -p myapplication.jsb3 -d .

ビルドは失敗します。この場合、パス c:\...\myapplication\myapplication\app\controller: the current path + the appFolder setting でコントローラなどのカスタム コードを見つけようとするためです。1 レベル上で実行する方がよいと思われますが、(共有) extjs-4.1.1 ディレクトリを見つけることができません。

Ext JS MVC 構造と SDK ツールがより柔軟になり、デフォルト構造からわずかに逸脱することはお勧めできません。すべて受け入れられますが、一方で、Ext JS 4.x (MVC 方式の Ext JS) を URL 書き換え (mod_rewrite) と統合することも、非常に一般的な方法である必要がありますか?

提案された作業セットアップ/構造は高く評価されます。

目標は次のとおりです。

  • jsb3 ファイルを手動で編集する必要はありません。
  • extjs-4.1.1 ディレクトリを最上位に保持して、アプリケーション間で共有します。
  • サーバー側の MVC アプリケーションでは使用されず、手動で更新する必要があるため、app.html ファイルはありません。
  • サーバー側で生成された HTML 内に app.js のコンテンツを含めると、動的に生成されたパラメーターを受け取ることができるので、さらに便利です。
4

3 に答える 3

0

カップルのもの。

まず、ローダーで ExtJs ライブラリとアプリの絶対パスを指定する必要はありません。

...
appFolder: 'app' // should be enough
...

2 つ目は、ビルドと本番の違いについてですが、最終的に 2 つの .html ファイル (index.html と index-dev.html) が作成されました。これらのファイルは (一度設定すると) 変更されないため、同期を維持することは問題ありません。

開発のニーズ、デバッグ、およびビルド プロセスには index-dev.html を使用します。基本的に、このファイルはローカル開発環境用に構成されています。

index.html は、app.js の結合および縮小されたバージョンを使用し、運用展開用に構成されています。

于 2012-07-29T15:13:35.850 に答える
0

mod rewrite を使用すると、Symfony のわずかに変更された .htaccess ファイルを使用できます。

<IfModule mod_rewrite.c>
    RewriteEngine On

    #<IfModule mod_vhost_alias.c>
    #    RewriteBase /
    #</IfModule>

    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^(.*)$ app.php [QSA,L]
</IfModule>

このファイルにより、

  • 実際のファイル (css、js、画像など) の場合、サーバーからリソースを取得します。
  • サーバーのファイルシステムに一致するものがない場合、URL 部分をクエリ パラメータに変換します。

これはセットアップで機能するはずです。app.php 行をアプリケーションのエントリポイントに変更するだけです。

ディレクトリのセットアップについては、あなたのもので問題ありません。いくつかのことだけです。

  • http://www.sencha.com/products/sencha-cmd/download/ (v3.0.0)からダウンロードできるため、SDK ツールは古くなっています 。

  • http://docs.sencha.com/ext-js/4-1/#!/guide/commandのドキュメントに従って、必要なクラスで「ビルド」を取得できますが、最終的に、または手動で開発を切り替えることができます/ 実稼働 JavaScript ファイルを使用するか、コードで環境変数を使用して切り替えます。

  • 実際には、ビルド ディレクトリで「偽の」index.html を使用して、ツールをビルドすることで変更できると思います。その後、プロダクション コードで、sencha ビルドによって生成されたコードを模倣できます。

于 2012-11-28T07:59:27.163 に答える