B リリース17.0.0でのOracle JETアプリケーションの移行

Oracle JETツールを使用してOracle JETバージョン5.x.0以降でアプリケーションをスキャフォールドしていた場合、手動でアプリケーションをバージョン17.0.0に移行できます。

アプリケーションを移行する前に、Oracle JETのリリース・ノートで、コンポーネント、フレームワーク、またはアプリケーションに影響を及ぼす可能性のある、その他の変更について確認してください。

重要:

このプロセスはバージョン5.0.0以前のOracle JETリリースにはサポートされていません。

ノート:

Altaテーマは、リリース10.0.0で非推奨となり、12.xリリースまでサポートされる予定です。リリース13.0.0以降では、Oracle JETはAltaの「ベスト・エフォート」サポートを提供する予定です。Altaのみの問題については、バグ修正や新機能は提供されません。Oracle JETのリリース・スケジュールの詳細は、Oracle JETのリリース・スケジュールについてを参照してください。

Oracle JETアプリケーションでAltaテーマを使用する方法を説明したコンテンツは、ドキュメントから削除されており、Oracle JETクックブックからも削除されています。ドキュメントを参照する場合は、「Oracle JET v9.0.0以降でのAltaテーマ」が最後に公開されているドキュメントのリリース11.1.0を参照してください。

リリース9.x.0以降からリリース17.0.0へのRedwoodテーマのアプリケーションの移行

Oracle JETアプリケーション・ソースをバージョン9.x.0以降から最新バージョン17.0.0に移行するには、NPMパッケージをアップグレードし、テーマおよびライブラリの参照パスを更新して、path_mapping.jsonファイルを置き換える必要があります。また、JETリリース9.0.0のプレビュー機能としてCSS変数を導入したoj-redwood-cssvars*.cssファイルへの参照を置き換えます。CSS変数は、JETリリース10.0.0の本番機能でした。最後に、ビルド時に必要なスクリプト・タグで自動的に置換されるスクリプト・インジェクタ・トークンをappDirRoot/src/index.htmlに含めます。

始める前に:

  • Oracleでは、移行前にOracle JET監査フレームワーク(JAF)を使用してアプリケーションを監査することを強くお薦めします。JAFで提供される組込み監査ルールは、非推奨のコンポーネントやAPIを含む無効な機能を特定して修正するのに役立ちます。JETリリース17.0.0への移行を確実に成功させるために、細部に注意して監査結果を実装します。

    Windowsでは管理者として、MacintoshおよびLinuxシステムではsudoを使用して、ターミナル・ウィンドウで次のコマンドを入力します。

    npm install -g @oracle/oraclejet-audit

    アプリケーション・ルートで、次のJAFコマンドを実行してアプリケーションの監査を初期化します。

    ojaf --init

    生成されたAppRootDir/oraclejafconfig.jsonファイルで、jetVerプロパティの値をアプリケーションの移行先のリリースに設定します。たとえば、"jetVer": "17.0.0"です。

    次のコマンドを実行して、アプリケーションを監査し、監査で特定された問題を確認します。

    ojaf

    JAFの詳細は、『Oracle JET Audit Frameworkの使用および拡張』Oracle JAFの初期化と監査の実行に関する項を参照してください。

  • Node.jsのメンテナンスまたはアクティブな長期サポート(LTS)バージョンが必要です。管理者として「コマンド・プロンプト」ウィンドウを開き、Node.jsのバージョンを確認します。

    node -v

    Nodejsバージョンが、Nodejs.org Webサイトのリリースに関するページでメンテナンスまたはアクティブなLTSとしてリストされているバージョンよりも前の場合は、新しいLTSバージョンをダウンロードします。Nodejs.org Webサイトに移動します。「LTS Version (Recommended for Most Users)」の下で、ご使用のシステムに対応するインストーラをダウンロードします。「ダウンロード」ダイアログ・ボックスでファイルのための場所を選択し、「保存」をクリックします。ダウンロードしたインストーラを管理者として実行し、インストール・ウィザードのステップに従ってNode.jsをインストールします。

    また、追加の注意事項として、バージョン16以上のNode.jsをインストールする場合は、appRootDir/oraclejetconfig.jsonファイルのsassVerの値を、インストールしたNode.jsバージョンと互換性のあるnode-sassのバージョンに変更してください。ojet add themingコマンドを実行してOracle JETアプリケーションでカスタム・テーマを使用すると、Oracle JETでは、sassVerで指定されているnode-sassのバージョンがインストールされます。たとえば、Node.jsのv16.17.1をインストールした場合は、appRootDir/oraclejetconfig.jsonファイルに"sassVer": "7.0.0"を設定します。

  • JETリリース9.0.0以降、TypeScript開発用に構成されたアプリケーションでは、コンパイルを実行するためにTypeScriptライブラリをローカルにインストールする必要があります。アプリケーションがTypeScript開発用に構成されている場合、それがローカルにインストールされていることを確認するには、アプリケーションのルートから次のコマンドを実行します。

    ojet add typescript

    JETツールは、サポートされている最新バージョンのTypeScript言語(5.4.5)をインストールします。

アプリケーションを移行するには:

  1. ojet-cliツール・パッケージの既存のバージョンを削除して、最新バージョンをインストールします。

    Windowsでは管理者として、MacintoshおよびLinuxシステムではsudoを使用して、ターミナル・ウィンドウで次のコマンドを入力します。

    [sudo] npm uninstall -g ojet-cli
    npm install -g @oracle/ojet-cli@~17.0.0
  2. 次のコマンドを入力してアプリケーションの最上位ディレクトリに移動し、ローカルのNPM依存性をアップグレードします:
    cd appDir
    npm uninstall @oracle/oraclejet @oracle/oraclejet-tooling
    npm install @oracle/oraclejet@~17.0.0 @oracle/oraclejet-tooling@~17.0.0 --save
  3. アプリケーションのsrcディレクトリで、前のバージョンにハードコードされたすべての参照を置き換えます。
    1. 次のようなRedwoodへのCSS参照がsrc/index.htmlファイルに出現する場合:
      <!-- This is the main css file for the default theme -->
       <!-- injector:theme -->
        <link rel="stylesheet" href="css/libs/oj/v9.0.0/redwood/oj-redwood-min.css" 
              type="text/css"/>
       <!-- endinjector -->

      injector:themeエントリのみが残るように<link>タグを削除します:

      <!-- This is the main css file for the default theme -->
       <!-- injector:theme -->
       <!-- endinjector -->
    2. .htmlおよび.jsファイルに出現する可能性のある前のリリース・バージョンにハードコードされた参照を検索して、それらを現在のリリース・バージョンに置き換えます。

  4. src/index.htmlファイルに存在する場合は、次のスクリプト・タグを置き換えます:
    . . . 
        <script type="text/javascript" src="js/libs/require/require.js"></script>
        <script type="text/javascript" src="js/main.js"></script>
      </body>
    </html>

    次のスクリプト・タグ・インジェクタ・トークンを使用します:

     . . .   
      <!-- This injects script tags for the main javascript files -->
    	<!-- injector:scripts -->
    	<!-- endinjector -->
      </body>
    </html>

    作成時に、これらのトークンは必要なスクリプト・タグに自動的に置き換えられます。デバッグ・ビルド時に、トークンは、require.jsおよびmain.jsファイルをロードするスクリプト・タグに置き換えられます。リリース・ビルド時に、トークンは、require.jsおよびbundle.jsファイルをロードするスクリプト・タグに置き換えられます。リリース・ビルド時には使用されなくなるため、ビルドの最後にmain.jsファイルが削除されます。つまり、アプリケーションでスクリプト・タグ・インジェクタ・トークンを使用しない場合は、main.jsではなくbundle.jsをロードするappRootDir/src/index.htmlファイルにスクリプト・タグを含める必要があります。

  5. ターミナル・プロンプトで、移行中のアプリケーションにコピーするファイルを取得するために、navdrawerテンプレートを指定して一時アプリケーションを作成します。
    ojet create tempApp --template=navdrawer
  6. 一時アプリケーションのpackage.jsonおよびoraclejetconfig.jsonファイル内のエントリを確認して、リリース17.0.0のJETに、リリース17.0.0に移行するアプリケーションで作成する必要がある新規または変更済のエントリが含まれていないことを確認します。
    特に、Oracle JETアプリケーションで使用できるオプション機能については、oraclejetconfig.jsonファイル内の様々な*Librariesプロパティによって参照されるバージョン番号に注意してください。これらのプロパティ(typescriptLibrarieswebpackLibrariesmochaTestingLibrariesおよびjestTestingLibraries)は、TypeScript、Webpackまたはテスト・ライブラリを使用する場合、Oracle JETアプリケーションに必要な追加パッケージを参照します。
  7. 一時アプリケーションからpath_mappings.jsonファイルをコピーして、Oracle JETライブラリの構成パスを更新し、Oracleライブラリの17.0.0バージョンを参照します。
    1. 移行しているアプリケーションの名前src/js/path_mapping.jsonmigrating-path_mapping.jsonに変更します。

    2. tempApp/src/js/path_mapping.jsonを移行中のアプリケーションのsrc/jsディレクトリにコピーします。

    3. サードパーティ・ライブラリをアプリケーションに追加した場合は、path_mapping.jsonを編集するために開き、既存のエントリをコピーして必要に応じて変更し、migrating-path_mapping.jsonに表示される各ライブラリ用のエントリを追加します。次のコード・サンプルは、my-libraryという名前のサードパーティ・ライブラリ用に行う追加内容を示しています。

      "libs": {
      
          "my-library": {
            "cdn": "3rdparty",
            "cwd": "node_modules/my-library/build/output",
            "debug": {
              "src": "my-library.debug.js",
              "path": "libs/my-library/my-library.debug.js",
              "cdnPath": ""
            },
            "release": {
              "src": "my-library.js",
              "path": "libs/my-library/my-library.js",
              "cdnPath": ""
            }
          },
      ...
  8. 一時アプリケーションからコピーすることで、アプリケーション・スクリプト・テンプレートを更新します。
    1. tempApp/scripts/hooksディレクトリから移行中のアプリケーションのscripts/hooksディレクトリに新規スクリプト・テンプレート・ファイルをすべてコピーします。

    2. tempApp/scripts/hooksディレクトリにあるhooks.jsonスクリプト構成ファイルを、移行中のアプリケーションのscripts/hooksディレクトリにコピーします。更新された構成ファイルによって、新しいスクリプト・テンプレート・ファイルと対応するビルド・システム・フック・ポイントが関連付けられ、Oracle JET CLIがスクリプトをコールできるようになります

  9. アプリケーションで、main.jsアプリケーション・ブートストラップ・ファイルを開き、次のコードが含まれていることを確認します。
    1. requirejs.config定義のpathsプロパティに、開始と終了の//injectorおよび//endinjectorコメントが含まれていることを確認します。コメントが削除された場合は、次のようにrequirejs.config()定義に追加します。

         requirejs.config(
           {
             baseUrl: 'js',
      
             paths:
             /* DO NOT MODIFY
             ** All paths are dynamicaly generated from the path_mappings.json file.
             ** Add any new library dependencies in path_mappings json file.
             */
             //injector:mainReleasePaths
             {
                ...no need to revise...
             }
             //endinjector 
           }
         );

      アプリケーションのビルドまたは提供時に、ツールでは、これらのinjectorコメントの内容に従って、main.jsにリリース固有のライブラリ・パスを挿入します。前の移行ステップで更新されたpath_mapping.jsonファイルにより、このリリースにとって適切なライブラリ構成パスが、移行されるアプリケーションに含まれることが保証されます。

    2. main.jsファイルのapp.loadModule()に加えた変更が表示されることを確認します。

      JETリリース9.0.0以降、app.loadModule()は非推奨になり、main.jsから削除されましたが、ブートストラップ・コードは引き続き関数を使用することもできます(パスを変更する場合など)。リリース9.x.0より前に作成されたアプリケーションの移行はloadModule()に依存するため、関数は移行されたmain.jsファイルに残る必要があり、移行されたappController.jsファイルにはloadModule()定義が含まれている必要があります。

      JETリリース9.0.0以降、作成した新しいアプリケーションでは、loadModule()の監視可能な依存性は、oj-module要素で使用する非推奨のojRouterのサポートに使用されなくなりました。初期アプリケーション・テンプレートでは、CoreRouterを使用し、ModuleRouterAdapterを介してoj-moduleを操作するようになりました。

    3. プライベート関数_ojIsIE11main.jsアプリケーション・ブートストラップ・ファイルにある場合は、これを削除します。この関数は、必要なポリフィルとOracle JETのES5バージョンにトランスパイルされたものをロードするために、アプリケーションがIE11 Webブラウザで実行されているかどうかを検出するために以前組み込まれていました。JETリリース11.0.0以降、JETではIE11のサポートが削除され、IE11 WebブラウザでJETアプリケーションを実行するためのポリフィルおよびその他のリソースが配布されなくなります。その結果、_ojIsIE11関数は目的を果たさないため、削除できます。

      (function () {
      
         function _ojIsIE11() {
            var nAgt = navigator.userAgent;
            return nAgt.indexOf('MSIE') !== -1 || !!nAgt.match(/Trident.*rv:11./);
         };
         var _ojNeedsES5 = _ojIsIE11();
      
         requirejs.config(
           {
            ...
           }
         );
      }());
  10. アプリケーションのルート・フォルダにあるoraclejetconfig.jsonファイルを開き、それにsassVerおよびdefaultThemeの次のプロパティおよび設定が含まれていることを確認します。次の例では、アプリケーションでRedwoodテーマが使用されるようにredwoodを指定します。アプリケーションでカスタム・テーマを使用する場合は、カスタム・テーマの名前を指定します。たとえば、"defaultTheme": "myCustomTheme",
    {
      "paths": {
        "source": {
    	"common": "src",
    	"web": "src-web",
    	"hybrid": "src-hybrid",
    	"javascript": "js",
    	"typescript": "ts",
    	"styles": "css",
    	"themes": "themes"
        },
        "staging": {
    	"web": "web",
    	"hybrid": "hybrid",
    	"themes": "staged-themes"
        }
      },
      "defaultBrowser": "chrome",
      "sassVer": "8.0.0",
      "defaultTheme": "redwood",
      "typescriptLibraries": "...",
      "webpackLibraries": "...",
      "mochaTestingLibraries": "...",
      "jestTestingLibraries": "...",
      "architecture": "mvvm"
    }

    アプリケーションでTypeScript、Webpackまたはテスト・ライブラリを使用する場合は、前に作成した一時アプリケーション(./tempApp/oraclejetconfig.json)のエントリを確認して、これらの機能の*Librariesプロパティが最新であることを確認します。

  11. 移行をテストし、ルック・アンド・フィールを検証します。
    1. アプリケーションがカスタム・テーマを使用している場合、前のリリースから現在のリリースに更新した後にカスタム・テーマを再コンパイルしないと、次のコンソール・エラー・メッセージが表示されることがあります:

      "Your CSS file is incompatible with this version of JET (17.0.0)"

    2. カスタム・テーマを新しいJETバージョンと互換にするには、ojet add sassを実行してSass処理を有効にします。

    3. 適切なオプションを指定してojet buildおよびojet serveを実行し、アプリケーションを作成および提供します。

      使用可能なオプションのリストについては、アプリケーションの最上位ディレクトリのターミナル・プロンプトで次のコマンドを入力してください: ojet help

      アプリケーションでカスタム・テーマが使用されている場合は、--themeオプションを含めてCSSを再コンパイルする必要があります:
      ojet build [options] --theme=myTheme
      複数のカスタム・テーマを指定するには、次を使用します。
      ojet build [options] --theme=myTheme --themes=myTheme,myTheme1,myTheme2
  12. オプション: アプリケーションが正常に移行されたら、一時アプリケーションを削除し、移行されたアプリケーションから名前を変更したmigrating-path_mapping.jsonおよびmigrating-main.jsファイルを削除します。問題が見つかった場合は、監査レポート用にJAF監査ツールを再実行できます。

RedwoodテーマCSSへの移行

Redwoodテーマは、アプリケーションのルック・アンド・フィールに関するOracle JET標準であり、アプリケーションをRedwoodテーマに移行するときに使用できます。

Altaテーマから移行する既存のアプリケーションがある場合は、JETリリース17.0.0に移行し、Oracle JETに付属するRedwood CSSで実行されるようにアプリケーションを構成できます。アプリケーション・ソースの移行プロセスを完了すると、Redwood CSSディストリビューションを入手したことになります。

アプリケーションのAltaテーマをRedwoodテーマに移行するには、アプリケーション・レベルで変更を加える必要があります。oraclejetconfig.jsonファイルを編集して、JETツールによるビルドにRedwoodまたはAlta CSSのどちらを使用するかを制御します。設定を構成してアプリケーションをリビルドすると、アプリケーションのindex.htmlファイル内のスタイルシート・インジェクタで指定された適切なCSSがすべてのページで使用されます。

Redwoodテーマを新しいデフォルトとして設定し、アプリケーションを実行すると、アプリケーションのルック・アンド・フィールが大幅に変わっていることがわかります。Redwoodテーマに適応させるには、新しいフォント、サイズおよびパターン用のアプリケーション・レイアウトを手動で更新する必要があります。

RedwoodテーマでサポートされているCSS変数は、JETリリース9.0.0のプレビュー機能としてoj-redwood-cssvars*.cssファイルに導入されました。JETリリース10.0.0では、CSS変数は本番機能になり、oj-redwood*.cssファイルに含まれるようになりました。移行したアプリケーションのoj-redwood-cssvars*.cssファイルへの参照をoj-redwood*.cssファイルへの参照に置き換えます。Redwoodテーマを使用するようにアプリケーションを移行し、リリース10.0.0より前のJETリリースでCSS変数の使用を開始した場合は、この変更に注意してください。

始める前に:

  • Redwoodテーマに移行する前に、アプリケーション・ソース・ファイルの移行を完了します。最初にAltaテーマを保持した状態で移行してから、Redwoodテーマに移行します。こうすることで、Redwoodテーマでアプリケーションをテストし、必要であれば簡単にAltaテーマに戻すことができます。詳細は、「8.3.0より前のリリースからリリース17.0.0へのAltaテーマのアプリケーションの移行」を参照してください。

  • カスタム・テーマを使用する場合、リリース・ノートのテーマの変更に関する項を確認し、カスタム・テーマを手動で更新します。

    Altaテーマでオーバーライドした可能性のあるSass変数は、RedwoodテーマのCSS変数に移行する必要があることに注意してください。カスタム・テーマの移行の詳細は、「Oracle JETのCSS変数およびカスタム・テーマについて」を参照してください。

  • アプリケーションのイメージを確認し、非推奨のOracle JETフレームワーク・イメージ・ライブラリに属するイメージを、Oracle Apex Universal ThemeFont Awesomeにあるイメージなどのパブリック・ドメイン・イメージに置き換える方法を検討してください。Oracle JETフレームワーク・イメージ・クラスは、リリース9.0.0以降のJETクックブックに表示されなくなりました。

RedwoodテーマCSSに移行するには:

  1. Redwood CSSをロードするようにアプリケーションを構成します。

    <app_root>/oraclejetconfig.jsonファイルを編集し、defaultThemeプロパティをredwoodに変更します。

    {
      "paths": { 
           ...
         }
       },
       "defaultBrowser": "chrome",
       "sassVer": "8.0.0",
       "defaultTheme": "redwood",
       "architecture": "mvvm"
    }

    これにより、oj-redwood-min.cssをアプリケーションのindex.htmlファイルのスタイルシート・リンクに挿入するように、JETツールが構成されます。

  2. 移行をテストし、ルック・アンド・フィールを検証します。

    適切なオプションを指定してojet buildおよびojet serveを実行し、アプリケーションを作成および提供します。

    使用可能なオプションのリストについては、アプリケーションの最上位ディレクトリのターミナル・プロンプトで次のコマンドを入力してください: ojet help

    アプリケーションでカスタム・テーマが使用されている場合は、--themeオプションを含めてCSSを再生成する必要があります:
    ojet build [options] --theme=myTheme
    複数のカスタム・テーマを指定するには、次を使用します。
    ojet build [options] --theme=myTheme --themes=myTheme,myTheme1,myTheme2

8.3.0より前のリリースからリリース17.0.0へのAltaテーマのアプリケーションの移行

Oracle JETアプリケーション・ソースをバージョン5.x.0からバージョン8.3.0を介して最新バージョン17.0.0に移行するには、npmパッケージをアップグレードし、テーマおよびライブラリの参照パスを更新して、path_mapping.jsonファイルを置き換える必要があります。また、JETリリース17.0.0でAlta CSSサポートを有効にするには、oraclejetconfig.jsonファイルを更新する必要があります。Redwood CSSテーマへの移行は、必要に応じて、アプリケーション・ソースの移行が成功したことを確認した後でのみ実行してください。最後に、ビルド時に必要なスクリプト・タグで自動的に置換されるスクリプト・インジェクタ・トークンをappDirRoot/src/index.htmlに含めます。

始める前に:

  • JETバージョン9.0.0より前のリリースと互換性がない可能性があるため、Oracle JET Audit Framework (JAF)を使用してアプリケーションを監査することを強くお薦めします。JAFで提供される組込み監査ルールは、非推奨のコンポーネントやAPIを含む無効な機能を特定して修正するのに役立ちます。JETリリース17.0.0への移行を確実に成功させるために、細部に注意して監査結果を実装します。

    Windowsでは管理者として、MacintoshおよびLinuxシステムではsudoを使用して、ターミナル・ウィンドウで次のコマンドを入力します。

    npm install -g @oracle/oraclejet-audit

    アプリケーション・ルートで、次のJAFコマンドを実行してアプリケーションの監査を初期化します。

    ojaf --init

    生成されたAppRootDir/oraclejafconfig.jsonファイルで、jetVerプロパティの値をアプリケーションの移行先のリリースに設定します。たとえば、"jetVer": "17.0.0"です。

    次のコマンドを実行して、アプリケーションを監査し、監査で特定された問題を確認します。

    ojaf

    JAFの詳細は、『Oracle JET Audit Frameworkの使用および拡張』Oracle JAFの初期化と監査の実行に関する項を参照してください。

  • Node.jsのメンテナンスまたはアクティブな長期サポート(LTS)バージョンが必要です。管理者として「コマンド・プロンプト」ウィンドウを開き、Node.jsのバージョンを確認します。

    node -v

    Nodejsバージョンが、Nodejs.org Webサイトのリリースに関するページでメンテナンスまたはアクティブなLTSとしてリストされているバージョンよりも前の場合は、新しいLTSバージョンをダウンロードします。Nodejs.org Webサイトに移動します。「LTS Version (Recommended for Most Users)」の下で、ご使用のシステムに対応するインストーラをダウンロードします。「ダウンロード」ダイアログ・ボックスでファイルのための場所を選択し、「保存」をクリックします。ダウンロードしたインストーラを管理者として実行し、インストール・ウィザードのステップに従ってNode.jsをインストールします。

    また、追加の注意事項として、バージョン16以上のNode.jsをインストールする場合は、appRootDir/oraclejetconfig.jsonファイルのsassVerの値を、インストールしたNode.jsバージョンと互換性のあるnode-sassのバージョンに変更してください。ojet add themingコマンドを実行してOracle JETアプリケーションでカスタム・テーマを使用すると、Oracle JETでは、sassVerで指定されているnode-sassのバージョンがインストールされます。たとえば、Node.jsのv16.17.1をインストールした場合は、appRootDir/oraclejetconfig.jsonファイルに"sassVer": "7.0.0"を設定します。

  • JETリリース9.0.0以降、TypeScript開発用に構成されたアプリケーションでは、コンパイルを実行するためにTypeScriptライブラリをローカルにインストールする必要があります。アプリケーションがTypeScript開発用に構成されている場合、それがローカルにインストールされていることを確認するには、アプリケーションのルートから次のコマンドを実行します。

    ojet add typescript

    JETツールは、サポートされている最新バージョンのTypeScript言語(5.4.5)をインストールします。

アプリケーションを移行するには:

  1. ojet-cliツール・パッケージの既存のバージョンを削除して、最新バージョンをインストールします。

    Windowsでは管理者として、MacintoshおよびLinuxシステムではsudoを使用して、ターミナル・ウィンドウで次のコマンドを入力します。

    [sudo] npm uninstall -g ojet-cli
    npm install -g @oracle/ojet-cli@~17.0.0
  2. 次のコマンドを入力してアプリケーションの最上位ディレクトリに移動し、ローカルのnpm依存性をアップグレードします:
    cd appDir
    npm uninstall @oracle/oraclejet @oracle/oraclejet-tooling
    npm install @oracle/oraclejet@~17.0.0 @oracle/oraclejet-tooling@~17.0.0 --save
  3. アプリケーションのsrcディレクトリで、前のバージョンにハードコードされたすべての参照を置き換えます。
    1. src/index.htmlファイルを編集して、既存のCSS参照をバージョンv17.0.0に置き換えます。

      <link rel="stylesheet" href="css/libs/oj/v17.0.0/alta/oj-alta-min.css" id="css" />
      
    2. .htmlおよび.jsファイルに出現する可能性のある前のリリース・バージョンにハードコードされた他の参照を検索して、それらを現在のリリース・バージョンに置き換えます。

  4. src/index.htmlファイルに存在する場合は、次のスクリプト・タグを置き換えます:
    . . . 
        <script type="text/javascript" src="js/libs/require/require.js"></script>
        <script type="text/javascript" src="js/main.js"></script>
      </body>
    </html>

    次のスクリプト・タグ・インジェクタ・トークンを使用します:

     . . .   
      <!-- This injects script tags for the main javascript files -->
    	<!-- injector:scripts -->
    	<!-- endinjector -->
      </body>
    </html>

    作成時に、これらのトークンは必要なスクリプト・タグに自動的に置き換えられます。デバッグ・ビルド時に、トークンは、require.jsおよびmain.jsファイルをロードするスクリプト・タグに置き換えられます。リリース・ビルド時に、トークンは、require.jsおよびbundle.jsファイルをロードするスクリプト・タグに置き換えられます。リリース・ビルド時には使用されなくなるため、ビルドの最後にmain.jsファイルが削除されます。つまり、アプリケーションでスクリプト・タグ・インジェクタ・トークンを使用しない場合は、main.jsではなくbundle.jsをロードするappRootDir/src/index.htmlファイルにスクリプト・タグを含める必要があります。

  5. ターミナル・プロンプトで、移行中のアプリケーションにコピーするファイルを取得するために、navdrawerテンプレートを指定して一時アプリケーションを作成します。
    ojet create tempApp --template=navdrawer
  6. 一時アプリケーションのpackage.jsonおよびoraclejetconfig.jsonファイル内のエントリを確認して、リリース17.0.0のJETに、リリース17.0.0に移行するアプリケーションで作成する必要がある新規または変更済のエントリが含まれていないことを確認します。
    特に、Oracle JETアプリケーションで使用できるオプション機能については、oraclejetconfig.jsonファイル内の様々な*Librariesプロパティによって参照されるバージョン番号に注意してください。これらのプロパティ(typescriptLibrarieswebpackLibrariesmochaTestingLibrariesおよびjestTestingLibraries)は、TypeScript、Webpackまたはテスト・ライブラリを使用する場合、Oracle JETアプリケーションに必要な追加パッケージを参照します。
  7. 一時アプリケーションからpath_mappings.jsonファイルをコピーして、Oracle JETライブラリの構成パスを更新し、Oracleライブラリの17.0.0バージョンを参照します。
    1. 移行しているアプリケーションの名前src/js/path_mapping.jsonmigrating-path_mapping.jsonに変更します。

    2. tempApp/src/js/path_mapping.jsonを移行中のアプリケーションのsrc/jsディレクトリにコピーします。

    3. サードパーティ・ライブラリをアプリケーションに追加した場合は、path_mapping.jsonを編集するために開き、既存のエントリをコピーして必要に応じて変更し、migrating-path_mapping.jsonに表示される各ライブラリ用のエントリを追加します。次のコード・サンプルは、my-libraryという名前のサードパーティ・ライブラリ用に行う追加内容を示しています。

      "libs": {
      
          "my-library": {
            "cdn": "3rdparty",
            "cwd": "node_modules/my-library/build/output",
            "debug": {
              "src": "my-library.debug.js",
              "path": "libs/my-library/my-library.debug.js",
              "cdnPath": ""
            },
            "release": {
              "src": "my-library.js",
              "path": "libs/my-library/my-library.js",
              "cdnPath": ""
            }
          },
      ...
  8. 一時アプリケーションからコピーすることで、アプリケーション・スクリプト・テンプレートを更新します。
    1. tempApp/scripts/hooksディレクトリから移行中のアプリケーションのscripts/hooksディレクトリに新規スクリプト・テンプレート・ファイルをすべてコピーします。

    2. tempApp/scripts/hooksディレクトリにあるhooks.jsonスクリプト構成ファイルを、移行中のアプリケーションのscripts/hooksディレクトリにコピーします。更新された構成ファイルによって、新しいスクリプト・テンプレート・ファイルと対応するビルド・システム・フック・ポイントが関連付けられ、Oracle JET CLIがスクリプトをコールできるようになります

  9. アプリケーションで、main.jsアプリケーション・ブートストラップ・ファイルを開き、次のコードが含まれていることを確認します。
    1. requirejs.config定義のpathsプロパティに、開始と終了の//injectorおよび//endinjectorコメントが含まれていることを確認します。コメントが削除された場合は、次のようにrequirejs.config()定義に追加します。

         requirejs.config(
           {
             baseUrl: 'js',
      
             paths:
             /* DO NOT MODIFY
             ** All paths are dynamicaly generated from the path_mappings.json file.
             ** Add any new library dependencies in path_mappings json file.
             */
             //injector:mainReleasePaths
             {
                ...no need to revise...
             }
             //endinjector 
           }
         );

      アプリケーションのビルドまたは提供時に、ツールでは、これらのinjectorコメントの内容に従って、main.jsにリリース固有のライブラリ・パスを挿入します。前の移行ステップで更新されたpath_mapping.jsonファイルにより、このリリースにとって適切なライブラリ構成パスが、移行されるアプリケーションに含まれることが保証されます。

    2. main.jsファイルのapp.loadModule()に加えた変更が表示されることを確認します。

      JETリリース9.0.0以降、app.loadModule()は非推奨になり、main.jsから削除されましたが、ブートストラップ・コードは引き続き関数を使用することもできます(パスを変更する場合など)。アプリケーションの移行はloadModule()に依存するため、関数は移行されたmain.jsファイルに残る必要があり、移行されたappController.jsファイルにはloadModule()定義が含まれている必要があります。

      JETリリース9.0.0以降、作成した新しいアプリケーションでは、loadModule()の監視可能な依存性は、oj-module要素で使用する非推奨のojRouterのサポートに使用されなくなりました。初期アプリケーション・テンプレートでは、CoreRouterを使用し、ModuleRouterAdapterを介してoj-moduleを操作するようになりました。

    3. プライベート関数_ojIsIE11main.jsアプリケーション・ブートストラップ・ファイルにある場合は、これを削除します。この関数は、必要なポリフィルとOracle JETのES5バージョンにトランスパイルされたものをロードするために、アプリケーションがIE11 Webブラウザで実行されているかどうかを検出するために以前組み込まれていました。JETリリース11.0.0以降、JETではIE11のサポートが削除され、IE11 WebブラウザでJETアプリケーションを実行するためのポリフィルおよびその他のリソースが配布されなくなります。その結果、_ojIsIE11関数は目的を果たさないため、削除できます。

      (function () {
      
         function _ojIsIE11() {
            var nAgt = navigator.userAgent;
            return nAgt.indexOf('MSIE') !== -1 || !!nAgt.match(/Trident.*rv:11./);
         };
         var _ojNeedsES5 = _ojIsIE11();
      
         requirejs.config(
           {
            ...
           }
         );
      }());
  10. アプリケーションのルート・フォルダにあるoraclejetconfig.jsonファイルを開き、それにsassVerおよびdefaultThemeの次のプロパティおよび設定が含まれていることを確認します。アプリケーションでカスタム・テーマを使用する場合は、かわりにカスタム・テーマの名前を指定します。たとえば、"defaultTheme": "myCustomTheme",
    {
      "paths": {
        "source": {
    	"common": "src",
    	"web": "src-web",
    	"hybrid": "src-hybrid",
    	"javascript": "js",
    	"typescript": "ts",
    	"styles": "css",
    	"themes": "themes"
        },
        "staging": {
    	"web": "web",
    	"hybrid": "hybrid",
    	"themes": "staged-themes"
        }
      },
      "defaultBrowser": "chrome",
      "sassVer": "8.0.0",
      "defaultTheme": "alta",
      "typescriptLibraries": "...",
      "webpackLibraries": "...",
      "mochaTestingLibraries": "...",
      "jestTestingLibraries": "...",
      "architecture": "mvvm"
    }

    "defaultTheme": "alta"を設定すると、アプリケーションを移行して、Altaテーマを維持できます。このプロパティは、後の移行プロセスでRedwoodテーマへの移行をサポートします。アプリケーションでカスタム・テーマを使用する場合は、かわりにカスタム・テーマの名前を指定します。たとえば、"defaultTheme": "myCustomTheme",

    アプリケーションでTypeScript、Webpackまたはテスト・ライブラリを使用する場合は、前に作成した一時アプリケーション(./tempApp/oraclejetconfig.json)のエントリを確認して、これらの機能の*Librariesプロパティが最新であることを確認します。

  11. 移行をテストし、ルック・アンド・フィールを検証します。
    1. アプリケーションでカスタム・テーマを使用する場合は、ojet add sassを実行してSass処理を有効にします。

    2. 適切なオプションを指定してojet buildおよびojet serveを実行し、アプリケーションを作成および提供します。

      使用可能なオプションのリストについては、アプリケーションの最上位ディレクトリのターミナル・プロンプトで次のコマンドを入力してください: ojet help

      アプリケーションでカスタム・テーマが使用されている場合は、--themeオプションを含めてCSSを再生成する必要があります:
      ojet build [options] --theme=myTheme
      複数のカスタム・テーマを指定するには、次を使用します。
      ojet build [options] --theme=myTheme --themes=myTheme,myTheme1,myTheme2
  12. オプション: アプリケーションが正常に移行されたら、一時アプリケーションを削除し、移行されたアプリケーションから名前を変更したmigrating-path_mapping.jsonおよびmigrating-main.jsファイルを削除します。問題が見つかった場合は、監査レポート用にJAF監査ツールを再実行できます。

アプリケーションを移行し、Altaテーマで実行されることを確認したら、「RedwoodテーマCSSへの移行」で説明するように、追加の別のプロセスに従ってRedwoodテーマに移行できます。