UXPin Mergeを使用し、独自のReactコンポーネントライブラリを接続している場合、Forgeはそれらのコンポーネントを使用してUIを生成・編集できます。

汎用的な要素ではなく、ForgeはエクスポートされたReactコンポーネントとそのプロパティを用いて実際のJSXを構築します。これにより、生成されるUIはコードベースに存在する構造と同一になります。

MergeライブラリへのAIサポートの有効化

コンポーネントライブラリにAIサポートを有効化するには：

  1. ライブラリの「Uxpin.config.js」ファイルの設定フィールドに以下の設定を追加してください：
const path = require('path');
const fs = require('fs');

module.exports = {
  components: './src/components/**/*.[jt]sx?(x)',

  settings: {
    useAI: {
      name: "Your Design System Name",
      documentationUrl: "",
      systemPrompt: "",
    },
  },
};

更新された「Uxpin.config.js」ファイルをプッシュしてください。

npx uxpin-merge push --token="YOUR_TOKEN"

設定後、ライブラリはForgeのライブラリピルに表示されます。

重要な注意事項