fix-partially-deprecated-apis

Name: fix-partially-deprecated-apis
Author: ui5

github.com/ui5開発44142 回インストール1 週間前に更新

リポジトリ

fix-partially-deprecated-apis について

UI5 開発者向けの開発スキルです。UI5 linter が検出しても自動修正できない非推奨 API の使用を、引数、ビュー形式、ルーティング、フォーマッターなどの変更で修正します。

主な機能

01非推奨の Parameters.get 使用法を修正
02JSONModel.loadData の引数を更新
03非推奨の ODataModel 引数を置換
04ビューとフラグメントを XML に変換
05Router の非同期設定
06JS フォーマッターで関数参照を使用

活用シーン

01UI5 linter の非推奨 API 指摘を解消
02既存 UI5 アプリの API 呼び出しを更新
03lint 後にビュー、フラグメント、ルーティングを確認

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/ui5/plugins-coding-agents --skill fix-partially-deprecated-apis

インストール後、Claude Code で/fix-partially-deprecated-apisを入力して読み込まれたか確認します。

詳細

一部の非推奨 API を修正する

このスキルは、UI5 リンターが検出するものの、使用されている非推奨のバリエーションを特定する必要があるため自動修正できない API の使用を修正します。

クイックリファレンス

API	非推奨の使用方法	修正方法
`Parameters.get`	引数なし、文字列、または配列	`name` と `callback` を持つオブジェクト
`JSONModel.loadData`	`bAsync=false`（第 3 引数）	省略するか `true` を設定
`Mobile.init`	`homeIcon`／`homeIconPrecomposed`	削除し、Web マニフェストを使用
`ODataModel.v2.createEntry`	`batchGroupId`	`groupId` を使用
`ODataModel.v2.createEntry`	配列としての `properties`	値を含むオブジェクトを使用
`View.create`	`type: "JS/JSON/HTML/Template"`	`"XML"` を使用するか、省略
`Fragment.load`	`type: "HTML"`	`"XML"` を使用するか、省略
`Router` コンストラクター	`async` がない、または `false`	`async: true` を設定
バインディングフォーマッター	JavaScript 内の文字列値	関数参照

対応するリンタールール

ルール ID	メッセージのパターン	このスキルでの対応
`no-deprecated-api`	'sap/ui/core/theming/Parameters.get' の非推奨バリエーションの使用	オブジェクトパラメーターを使用
`no-deprecated-api`	'sap/ui/model/json/JSONModel#loadData' のパラメーター '...' に対する非推奨の値の使用	パラメーターを削除／変更
`no-deprecated-api`	'sap/ui/util/Mobile#init' のパラメーター '...' に対する非推奨の値の使用	パラメーターを削除
`no-deprecated-api`	'sap/ui/model/odata/v2/ODataModel#createEntry' での非推奨パラメーター 'batchGroupId' の使用	groupId を使用
`no-deprecated-api`	'sap/ui/core/mvc/View.create' のパラメーター 'type' に対する非推奨の値 '...' の使用	XML タイプを使用
`no-deprecated-api`	'sap/ui/core/Fragment.load' のパラメーター 'type' に対する非推奨の値 '...' の使用	XML タイプを使用
`no-deprecated-api`	'sap/ui/core/Router' コンストラクターのパラメーター 'oConfig.async' に対する非推奨の値の使用	`async: true` を設定
`unsupported-api-usage`	JavaScript では 'formatter' の値に文字列を使用しないでください	関数参照を使用

使用するタイミング

次のようなリンター出力が表示された場合に、このスキルを適用します。

MyController.js:15:5 error Usage of deprecated variant of 'sap/ui/core/theming/Parameters.get'  no-deprecated-api
MyController.js:20:5 error Usage of deprecated value for parameter 'bAsync' of 'sap/ui/model/json/JSONModel#loadData'  no-deprecated-api
MyController.js:25:5 error Usage of deprecated parameter 'batchGroupId' in 'sap/ui/model/odata/v2/ODataModel#createEntry'  no-deprecated-api
MyController.js:30:5 error Do not use strings for 'formatter' values in JavaScript  unsupported-api-usage

修正方法

1. Parameters.get - 古いバリエーション

問題：オブジェクトパラメーターを指定せずに Parameters.get() を呼び出しています。

// Before - all these variants are deprecated
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/core/theming/Parameters"
], function(Controller, Parameters) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onInit: function() {
            // Deprecated: no arguments
            var allParams = Parameters.get();

            // Deprecated: string argument
            var singleParam = Parameters.get("sapUiBaseColor");

            // Deprecated: array argument
            var multiParams = Parameters.get(["sapUiBaseColor", "sapUiBaseBG"]);
        }
    });
});

修正方法：コールバックを含むオブジェクトパラメーターを使用します。

// After - use object parameter
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/core/theming/Parameters"
], function(Controller, Parameters) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onInit: function() {
            // Correct: object parameter with name and callback
            Parameters.get({
                name: "sapUiBaseColor",
                callback: function(sValue) {
                    // Use the parameter value
                    console.log("Color:", sValue);
                }
            });

            // Correct: multiple parameters
            Parameters.get({
                name: ["sapUiBaseColor", "sapUiBaseBG"],
                callback: function(mParams) {
                    // mParams is an object with parameter values
                    console.log("Base color:", mParams.sapUiBaseColor);
                    console.log("Base BG:", mParams.sapUiBaseBG);
                }
            });
        }
    });
});

2. JSONModel.loadData - 非推奨のパラメーター

問題：loadData() で bAsync=false または bCache=false を使用しています。

// Before - bAsync=false is deprecated (3rd parameter)
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/model/json/JSONModel"
], function(Controller, JSONModel) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onInit: function() {
            var oModel = new JSONModel();

            // Deprecated: bAsync=false (synchronous loading)
            oModel.loadData("/api/data", null, false);

            // Deprecated: bCache=false (6th parameter)
            oModel.loadData("/api/data", null, true, "GET", false, false);
        }
    });
});

修正方法：非同期読み込み（デフォルト）を使用し、キャッシュパラメーターを削除します。

// After - use async loading
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/model/json/JSONModel"
], function(Controller, JSONModel) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onInit: function() {
            var oModel = new JSONModel();

            // Correct: async loading (default or true)
            oModel.loadData("/api/data").then(function() {
                // Handle loaded data
            });

            // Or with parameters, omitting deprecated ones
            oModel.loadData("/api/data", null, true, "GET");
        }
    });
});

3. Mobile.init - 非推奨のパラメーター

問題：Mobile.init() で homeIcon または homeIconPrecomposed を使用しています。

// Before - homeIcon and homeIconPrecomposed are deprecated
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/util/Mobile"
], function(Controller, Mobile) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onInit: function() {
            Mobile.init({
                homeIcon: "icons/icon.png",              // Deprecated
                homeIconPrecomposed: true,              // Deprecated
                statusBar: "default"
            });
        }
    });
});

修正方法：非推奨のパラメーターを削除します。

// After - remove homeIcon and homeIconPrecomposed
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/util/Mobile"
], function(Controller, Mobile) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onInit: function() {
            Mobile.init({
                statusBar: "default"
            });

            // Note: Use web app manifest (manifest.json) for home screen icons instead
        }
    });
});

代替方法：ホーム画面のアイコンは、Web アプリのマニフェストで定義します。

{
    "icons": [
        {
            "src": "icons/icon-192.png",
            "sizes": "192x192",
            "type": "image/png"
        }
    ]
}

4. ODataModel.v2.createEntry - 非推奨のパラメーター

問題：createEntry() で batchGroupId を使用するか、properties を配列として使用しています。

// Before - batchGroupId and properties array are deprecated
sap.ui.define([
    "sap/ui/core/mvc/Controller"
], function(Controller) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onCreate: function() {
            var oModel = this.getView().getModel();

            var oContext = oModel.createEntry("/Products", {
                batchGroupId: "myBatch",                      // Deprecated: use groupId
                properties: ["Name", "Price", "Category"]    // Deprecated: use object
            });
        }
    });
});

修正方法：groupId を使用し、初期値を含むオブジェクトとしてプロパティを渡します。

// After - use groupId and properties object
sap.ui.define([
    "sap/ui/core/mvc/Controller"
], function(Controller) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onCreate: function() {
            var oModel = this.getView().getModel();

            var oContext = oModel.createEntry("/Products", {
                groupId: "myBatch",                          // Correct: groupId
                properties: {                                // Correct: object with initial values
                    Name: "",
                    Price: 0,
                    Category: ""
                }
            });
        }
    });
});

5. View.create - 非推奨のビュータイプ

問題：非推奨のタイプ（JS、JSON、HTML、Template）でビューを作成しています。

// Before - non-XML view types are deprecated
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/core/mvc/View"
], function(Controller, View) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onInit: function() {
            View.create({
                viewName: "my.app.view.Detail",
                type: "JS"          // Deprecated: JS, JSON, HTML, Template
            }).then(function(oView) {
                // Use view
            });
        }
    });
});

修正方法：XML ビュータイプに変換します。

// After - use XML type (or omit type, XML is default)
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/core/mvc/View"
], function(Controller, View) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onInit: function() {
            View.create({
                viewName: "my.app.view.Detail",
                type: "XML"         // Or omit - XML is default
            }).then(function(oView) {
                // Use view
            });
        }
    });
});

注：JS／JSON／HTML のビューファイルを XML ビューファイルに変換する必要があります。

6. Fragment.load - 非推奨のフラグメントタイプ

問題：HTML タイプでフラグメントを読み込んでいます。

// Before - HTML fragment type is deprecated
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/core/Fragment"
], function(Controller, Fragment) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onOpenDialog: function() {
            Fragment.load({
                name: "my.app.fragment.Dialog",
                type: "HTML"        // Deprecated
            }).then(function(oFragment) {
                // Use fragment
            });
        }
    });
});

修正方法：XML フラグメントに変換します。

// After - use XML type (or omit, XML is default)
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/core/Fragment"
], function(Controller, Fragment) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onOpenDialog: function() {
            Fragment.load({
                name: "my.app.fragment.Dialog",
                type: "XML"         // Or omit - XML is default
            }).then(function(oFragment) {
                // Use fragment
            });
        }
    });
});

7. Router コンストラクター - async フラグがない

問題：async: true を指定せずに Router を作成しています。

// Before - missing or false async flag is deprecated
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/core/routing/Router"
], function(Controller, Router) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onInit: function() {
            // Deprecated: no config
            var oRouter1 = new Router([]);

            // Deprecated: async not set or false
            var oRouter2 = new Router([], {
                async: false
            });
        }
    });
});

修正方法：設定で async: true を指定します。

// After - set async: true
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/ui/core/routing/Router"
], function(Controller, Router) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        onInit: function() {
            var oRouter = new Router([], {
                async: true         // Required
            });
        }
    });
});

注：ほとんどのアプリでは、manifest.json を介して Component に組み込まれたルーターを使用します。Component.js に IAsyncContentCreation が実装されている場合、このルーターが自動的に処理します（fix-component-async スキルを参照）。

8. JS バインディングでの文字列フォーマッター

問題：JavaScript でフォーマッターに文字列値を使用しています。

// Before - string formatter doesn't work in JS
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/m/Input",
    "../model/formatter"
], function(Controller, Input, formatter) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        formatter: formatter,

        onInit: function() {
            var oInput = new Input({
                value: {
                    path: "/status",
                    formatter: "formatter.statusText"   // Error: string won't work
                }
            });
        }
    });
});

修正方法：関数参照を使用します。

// After - use function reference
sap.ui.define([
    "sap/ui/core/mvc/Controller",
    "sap/m/Input",
    "../model/formatter"
], function(Controller, Input, formatter) {
    "use strict";

    return Controller.extend("my.app.controller.Main", {
        formatter: formatter,

        onInit: function() {
            var oInput = new Input({
                value: {
                    path: "/status",
                    formatter: formatter.statusText    // Correct: function reference
                }
            });
        }
    });
});

注：文字列フォーマッターは XML ビューでは機能します（実行時に解決されるため）が、関数に直接アクセスできる JS では機能しません。

注意事項

API 全体ではなく、特定の使用パターンのみが非推奨になっているため、これらは「一部」非推奨です
最新化に関するドキュメントへのリンクは、必ず npx @ui5/linter --details で確認してください
ビュー／フラグメントの種類を変更するには、実際のビュー／フラグメントファイルを XML に変換する必要があります
Component.js で IAsyncContentCreation を使用する場合、Router の async: true は自動的に処理されます（正しい配置については fix-component-async スキルを参照してください）

Markdown 対応

ログインしてコメント

基本情報

作者: ui5
リポジトリ: ui5/plugins-coding-agents
カテゴリ: 開発
インストール数: 142
GitHub スター: 44

問題を報告