ui-to-vue

Topics in the source

• UI To Vue
• 使用するタイミング
• 使用しないタイミング
• 入力
• 変換モデル
• CLI使用方法
• オプション
• セキュリティとプライバシー

UIデザインのスクリーンショットをVue 3 Composition APIコンポーネントコードに一括変換します。 ユーザーがデザインスクリーンショットまたはデザインエクスポート画像のディレクトリを提供するとき。 ターゲットアプリケーションがVue 3のとき。 ユーザーがページコンポーネント、共有コンポーネント、ルーター配線の最初の変換を希望するとき。 ユーザーがVant、Element Plus、またはAnt Design Vueをコンポーネントライブラリとして指定するとき。 ユーザーがスクリーンショット1枚のみで、特定のコンポーネントを希望するとき。 ターゲットプロジェクトがVueでないとき。 デザインが詳細なインタラクションロジック、データフロー、またはアクセシビリティレビューを必要とするとき。 スクリーンショットに外部モデルAPIに送信できないプライベートな顧客データが含まれるとき。 モジュールとページ状態でスクリーンショットをグループ化したディレクトリを入力として使用します。 サポートされている切り出し画像ディレクトリ名：assets、icons、sprites、cut、images、cut-images。 ページグループ化：リスト、詳細、フォーム、ローディング、または空の状態を表す関連スクリーンショットを1つのページコンポーネントにまとめる。 UIライブラリマッピング：可能な限りネイティブのビジュアル要素をVant、Element Plus、またはAnt Design Vueコンポーネントにマッピングする。 切り出し画像の優先順位：ページレベルのアセットを優先し、次にモジュールレベル、最後にグローバル共有アセット。 コンポーネント抽出：繰り返し使われるUIリージョンが2回以上現れる場合は共有コンポーネントに抽出する。 グローバルバイナリに依存せず、ドキュメントに記載されたコマンドが機能するように npx でコンバーターを実行します： | オプション | 説明 | デフォルト | | --- | --- | --- | | --input | デザイン画像ディレクトリ | ./screenshots | | --ui | UIライブラリ：vant、element-plus、または antd-vue | vant | | --output | 出力ディレクトリ | ./src | | --config | 設定ファイルのパス | ./.ui-to-vue.config.json | デザインスクリーンショットを外部モデルAPIに送信される可能性があるソース素材として扱う。 許可なくプライベートな顧客デザインでこのフローを実行しないこと。 再現可能なワークフローでは @latest の代わりにコンバーターのバージョンを固定すること。 コミット前に生成さ

This is an excerpt. Refer to the complete source and its current requirements.