Ext.js-環境設定

ローカル環境のセットアップ

このセクションでは、マシンにExtJSをダウンロードしてセットアップする方法について説明します。手順に従って環境を設定してください。

ライブラリファイルのダウンロード

SenchaからExtJSライブラリファイルの試用版をダウンロードします https://www.sencha.com。試用版は、登録済みのメールIDのサイトから入手できます。これは、ext-6.0.1-trialという名前のzipフォルダーになります。

フォルダを解凍すると、さまざまなJavaScriptファイルとCSSファイルが見つかります。これらのファイルはアプリケーションに含まれます。主に次のファイルを含めます-

JavaScript Files −フォルダ\ ext-6.0.1-trial \ ext6.0.1 \ buildの下にあるJSファイルは−です。

シニア番号 ファイル説明
1

ext.js

これは、アプリケーションを実行するためのすべての機能を含むコアファイルです。

2

ext-all.js

このファイルには、ファイル内にコメントなしで縮小されたすべてのコードが含まれています。

3

ext-all-debug.js

これは、デバッグ用のext-all.jsの非縮小バージョンです。

4

ext-all-dev.js

このファイルも縮小されておらず、エラー/問題をチェックするためのすべてのコメントとコンソールログが含まれているため、開発目的で使用されます。

5

ext-all.js

このファイルは、他のどのファイルよりもはるかに小さいため、主に本番目的で使用されます。

これらのファイルをプロジェクトのJSフォルダーに追加することも、ファイルがシステム内に存在する直接パスを指定することもできます。

CSS Files −テーマベースのファイルがいくつかあり、フォルダ\ ext6.0.1-trial \ ext-6.0.1 \ build \ classic \ theme-classic \ resources \ theme-classic-all.cssにあります。

  • デスクトップアプリケーションを使用する場合は、フォルダ\ ext-6.0.1-trial \ ext-6.0.1 \ build \ classicでクラシックテーマを使用できます。

  • モバイルアプリケーションを使用する場合は、フォルダー\ ext-6.0.1-trial \ ext-6.0.1 \ build \ modernにある最新のテーマを使用できます。

次のライブラリファイルがExtJSアプリケーションに追加されます。

<html>
   <head>
      <link rel = "stylesheet" type = "text/css" 
         href = "..\ext-6.0.1-trial\ext-6.0.1\build\classic\theme-classic\resources\theme-classic-all.css" />
      <script type = "text/javascript" 
         src = "..\ext-6.0.1-trial\ext-6.0.1\build\ext-all.js" > </script>
      <script type = "text/javascript" src = "app.js" > </script>
   </head>
</html>

ExtJSアプリケーションコードはapp.jsファイルに保存します。

CDNセットアップ

CDNは、Ext JSライブラリファイルをダウンロードする必要のないコンテンツ配信ネットワークです。代わりに、次のようにExtJSのCDNリンクをプログラムに直接追加できます。

<html>
   <head>
      <link rel = "stylesheet" type = "text/css" 
         href = "https://cdnjs.cloudflare.com/ajax/libs/extjs/6.0.0/classic/theme-crisp/resources/theme-crisp-all.css" / >
      <script type = "text/javascript" 
         src = "https://cdnjs.cloudflare.com/ajax/libs/extjs/6.0.0/ext-all.js"> </script>
      <script type = "text/javascript" src = "app.js" > </script> 
   </head>
</html>

人気の編集者

これはWebアプリケーションの開発に使用されるJavaScriptフレームワークであるため、このプロジェクトではHTML、JSファイルを使用します。Ext JSプログラムを作成するには、テキストエディタが必要です。市場には複数のIDEがあります。しかし、今のところ、次のいずれかを考慮することができます-

  • Notepad − Windowsマシンでは、メモ帳(このチュートリアルに推奨)、メモ帳++、崇高なものなど、任意の単純なテキストエディターを使用できます。

  • Eclipse − eclipseオープンソースコミュニティによって開発されたIDEであり、からダウンロードできます。 https://www.eclipse.org/。

ブラウザ

Ext JSはブラウザ間の互換性をサポートし、次のようなすべての主要なブラウザをサポートします。

  • IE6以降
  • Firefox3.6以降
  • Chrome10以降
  • Safari4以降
  • Opera11以降

ExtJSアプリケーションの実行には任意のブラウザを使用できます。