Visual Studio コードでの CodeFuse の使用

データから大規模モデルのアプリケーションまで、開発のヒントを共有する杭州元創会議が 11 月 25 日に開催されました。

Visual Studio Code は、プログラマーの間で広く普及しているコードエディターとして、フロントエンド開発やさまざまなスクリプト言語開発において主流の地位を占めています。CodeFuse Intelligent R&D Assistant は、VS Code 用のプラグインを特別に開発しました。CodeFuse は、さまざまな機能が提供されていますが、VS Code で CodeFuse プラグインを使用する方法を見てみましょう。

CodeFuse公式サイト： https: //codefuse.alipay.com/

CodeFuse は現在、Alipay Mini Program Cloud Development、Visual Studio Code (以下、VS Code) を含む 10 の IDE、および JetBrains シリーズの 8 つの IDE (IntelliJ IDEA、PyCharm、WebStorm、GoLand、CLion、DataGrip、PhpStorm) へのインストールをサポートしています。そしてルビーマイン。この記事では、CodeFuse プラグインをローカル VS Code にインストールして使用する方法を紹介します。

注:現在、CodeFuse プラグインは VS Code 1.75.0 以降でのみサポートされています。

前提条件

CodeFuse プラグインをインストールする前に、 Visual Studio Codeをダウンロードしてインストールする必要があります。

プラグインのインストール

現在、VS Code の CodeFuse プラグインは、インストール用のプラグインインストールパッケージのダウンロードのみをサポートしています。インストールが完了したら、ログインを完了し、プラグインを使用するアプリケーションを渡す必要があります。プラグインをインストールする手順は以下のとおりです。

注:現在公式 Web サイトからダウンロードできる CodeFuse プラグインインストールパッケージはベータ版であるため、正式版のリリースをお待ちください。

CodeFuse 公式 Web サイトで、Visual Studio Code プラグインインストールパッケージをダウンロードします。
VS Code を開き、エディターの左側のナビゲーションバーにあるアイコンをクリックし、もう一度アイコンをクリックして、 [VSIX からインストール…]を選択します。
ダウンロードした CodeFuse-xxxvsix ファイルを選択し、 [インストール] をクリックします。
IDE の左側のナビゲーションバーで、アイコンをクリックしてプラグインパネルに入ります。
[プラグイン] パネルで、[ログイン]をクリックします。
ポップアップウィンドウで [ 開く]をクリックし、Alipay を使用してCodeFuse 公式 Web サイトにログインし、トライアルを申し込みます。以下の 2 つの申請ポータルのいずれかを選択して申請できます。

- 申し込み入口その1：CodeFuse公式サイトのトップページからトライアルを申し込みます。
- 応募入口2：プラグインパネルで体験応募します。

トライアルお申し込みのポップアップウィンドウで、お申し込みの理由を入力し、ユーザーサービス規約とプライバシー規約を読んで確認し、 [申し込みを送信]をクリックします。
申請が承認されたら、下図左側のプラグインパネルを確認して使用を開始してください。

プラグインを使用する

CodeFuse プラグインは以下の 2 つの使用モードをサポートしており、対応するモードでサポートされる動作は次のとおりです。

使用パターン	サポート業務
IDEコード編集エリア	コメントのテキストを入力し、Enter キーを押してコードを完成させます
右クリック	コードを選択した後、右クリックして「コメントの追加」を選択しますコードを選択した後、右クリックして「コードの説明」を選択します。コードを選択した後、右クリックして「単一テストの生成」を選択します。コードを選択した後、右クリックして「コードの最適化」を選択します。

CodeFuse プラグインは、複数のプログラミング言語やさまざまなフレームワークに対してコードの提案を提供でき、特に Python と Java でそのパフォーマンスが優れています。次に、Java を例として使用して、VS Code でプラグインを使用する方法を示します。

コード補完

コード補完機能は、インライン補完（単一行補完）やフラグメント補完（複数行補完）など、大量のデータに基づくリアルタイムのコード補完サービスを提供します。現在、この関数は、Java、Python、TypeScript、JavaScript、Go を含む 5 つの主流プログラミング言語での複数行および単一行のコード補完に加え、他の 40 のプログラミング言語での単一行のコード補完をサポートしています。

現在、CodeFuse は、自動コード補完と手動コード補完という 2 つのトリガー方法をサポートしています。自動コード補完をオフにした後でも、ショートカットキー (Alt/Option + \) を使用してコード補完を手動でトリガーできます。コード補完機能は複数の補完結果の切り替えにも対応しており、現時点では最大2件までの補完結果の切り替えに対応しています。以下のショートカットキーを使用して、完了結果を切り替えることができます。

Windowsキー	Macのキー	説明する
`Alt]`	`Option]`	次の完了結果を表示します。
`Alt[`	`Option[`	前回の完了結果を表示します。

単一行のコード補完

IDE エディタで Java ファイルを作成します。
Java ファイルでは、CodeFuse はコードのコンテキストに基づいて入力内容の補完ヒントを提供できます。たとえば、次のサンプルコードの後に Enter キーを押すと、プラグインによってコード補完プロンプトが表示されます。arr[i] = arr[j];

public class BubbleSort {
    public static void bubbleSort(int[] arr) {
        for (int i = 0; i < arr.length - 1; i++) {
            for (int j = 0; j < arr.length - 1 - i; j++) {
                if (arr[j] > arr[j + 1]) {
                    swap(arr, j, j + 1);
                }
            }
        }
    }
    private static void swap(int[] arr, int i, int j) {
        int temp = arr[i];
        arr[i] = arr[j];  ## 在此处按下回车触发补全，也可使用快捷键（Alt/Option + \）主动触发补全

    }
}

コード補完の提案を受け入れるには、 Tab ボタンを。

複数行のコード補完

このプラグインは、複数行のコード補完を完了するためのコメントテキストの入力もサポートしています。たとえば、次のコメント内容を入力して Enter キーを押します。CodeFuse はコメントの内容に基づいて複数行のコードを自動的に生成し、生成されたコードは灰色のテキストで表示されます。

/* 
* 判断字符串是否为英文
*/

コード補完の提案を受け入れるには、 Tab ボタンを。

入力して Enter キーを押すと、エディターの右下隅にコンテンツ生成のステータスが表示されます。

- コンテンツが生成されており、円のアニメーションと 実行中の プロンプトが表示されます。
- コンテンツが正常に生成されると、システムは CodeFuse アイコンを表示します。

自動コード補完をオフにする

自動コード補完機能はデフォルトで有効になっていますが、プラグインパネルの設定でこの機能をオフにして、単一行または複数行のコード補完が自動的にトリガーされないようにすることができます。

単一行のコード補完: たとえば、エディターに関数名を入力し、Enter キーを押します。
複数行のコード補完: たとえば、エディターにコメントテキストを入力し、Enter キーを押します。

注:コード補完の自動トリガーをオフにした後も、 Alt/Option + \ ショートカットキーを使用して、コード補完を手動でトリガーすることができます。

コードの説明

IDE エディタで Java ファイルを作成します。
Java ファイル内で解釈する必要があるコードフラグメントを選択します。
マウスを右クリックして CodeFuse: Explain Codeを選択すると、プラグインは左側のダイアログウィンドウにコードの説明を生成します。

メモを追加する

注:現在、モデルのアノテーション生成機能は関数レベル全体を比較的完全にサポートしているため、関数レベルでのアノテーションの生成を優先することをお勧めします。

IDE エディタで Java ファイルを作成します。
Java ファイル内でコメント化する必要があるコードフラグメントを選択します。
マウスを右クリックして CodeFuse: Add Comment を選択すると、選択したコードにコメントが自動的に生成されます。

単一のテストを生成する

IDE エディタで Java ファイルを作成します。
Java ファイルで単体テストを生成する必要があるコードスニペットを選択します。たとえば、次のコードスニペットに対して単一のテストを生成します。

public class Conversion {   
    public static byte binaryToByte(final boolean[] src, final int srcPos, final byte dstInit, final int dstPos,
            final int nBools) {
        if (src.length == 0 && srcPos == 0 || 0 == nBools) {
            return dstInit;
        }
        if (nBools - 1 + dstPos >= 8) {
            throw new IllegalArgumentException("nBools-1+dstPos is greater or equal to than 8");
        }
        byte out = dstInit;
        for (int i = 0; i < nBools; i++) {
            final int shift = i + dstPos;
            final int bits = (src[i + srcPos] ? 1 : 0) << shift;
            final int mask = 0x1 << shift;
            out = (byte) ((out & ~mask) | bits);
        }
        return out;
    }
}

マウスを右クリックして、 CodeFuse: Generate Single Testを選択します。プラグインは、左側のダイアログウィンドウで選択したコードのテストケースを生成します。

コードの最適化

大規模なモデルコード理解機能と静的ソースコード分析機能に基づいて、CodeFuse は選択されたコードフラグメントの分析と理解をサポートし、最適化と改善の提案を提示し、より良いコードの作成に役立つ改善提案に基づいてコードパッチを直接形成することもできます。コード最適化を使用する手順は次のとおりです。

IDE エディタで Java ファイルを作成し、最適化する必要があるコードを記述して選択します。
マウスを右クリックして CodeFuse: コードの最適化を選択すると、プラグインパネルに複数のコード最適化の提案が表示されます。
[上記の提案に従って選択したコードを最適化する]をクリックして、最適化されたコードを生成します。
生成されたコード上にマウスを置き、クリックするとコード変更の差分が表示されます。
リファクタリングのプレビュー画面で、変更内容を確認してクリック（画像①）し、 「適用」をクリックして（画像②）コードを置き換えます。[破棄]をクリックすると、コード Diff インターフェイスが終了し、この変更が破棄されます。

ショートカット

ショートカットキー

Windowsキー	Macのキー	説明する
`Tab`	`Tab`	コーディングに関する提案を考慮してください。プラグインによって生成されたコードを使用するには、エディターで Tab キーを押します。コードの提案を受け入れない場合は、左上隅にある Esc キーを押します。
`Alt\`	`Option\`	コード補完をアクティブにトリガーします。エディターでこのショートカットキーを押すと、カーソル位置でコード補完を手動でトリガーできます。注: 自動トリガーコード補完をオフにした後でも、このショートカットキーを使用して補完をトリガーできます。
`Alt]`	`Option]`	次の完了結果を表示します。
`Alt[`	`Option[`	前回の完了結果を表示します。

注: CodeFuse はカスタムショートカットキーをサポートしています。ショートカットキーの競合が発生した場合は、以下の手順に従ってショートカットキーを変更できます。

CodeFuse パネルのショートカット領域で、「設定に移動」をクリックします。
ショートカットキーページの検索ボックスに 「CodeFuse」 と入力してショートカットキーを検索し、ショートカットキーを選択してクリックして編集します。

素早い操作

ショートカット	説明する
セッションをクリアするヘルプドキュメント Webページへジャンプ	プラグインパネルの右上隅では、次の操作を行うことができます。クリックすると、現在のセッションのすべてのコンテンツが 1 回のクリックでクリアされます。クリックするとヘルプドキュメントが表示されます。クリックして CodeFuse 公式 Web サイトに移動します。
右クリック	コードフラグメントを選択し、右クリックしてコメントの追加、コードの説明、単体テストの生成、コードの最適化を選択します。
コードを素早くコピー、貼り付け、展開する	プラグインパネルで、生成されたコンテンツの右下隅にマウスを置くと、次の操作を実行できます。クリックすると、選択したコードが生成されたコードに置き換えられます。具体的な手順については、「コードの最適化」を参照してください。クリックすると、エディターのカーソル位置にコードをワンクリックで貼り付けることができます。クリックすると、ワンクリックでコードがコピーされます。クリックすると、ワンクリックでコードが展開され、完全なコードを読むことができます。
ショートカットコマンド	次の 2 つのショートカットコマンドがプラグインパネルの下部でサポートされています。 `/Explain`:選択したコードを説明します。 `/Test`: 選択したコードのテストケースを生成します。ショートカットコマンドを使用する手順は次のとおりです。エディターでコードの一部を選択し、コンテンツをクリックする`/Explain` か送信します。 `/Test`

コードの品質に関するフィードバック

CodeFuse によって生成されたコンテンツを評価し、好き嫌いの操作をサポートできます。

Like : CodeFuse によって生成されたコードが期待を満たしており、生成されたコードを直接使用できる場合は、「いいね！」やコメントをすることができます。
Dislike : CodeFuse によって生成されたコードに明らかな抜け穴がある場合、または間違った応答が返される場合は、「Dislike」をクリックしてフィードバックを得ることができ、モデルの応答品質の最適化を続けることができます。