regle-migrate-vuelidate について
Vuelidate のフォーム検証を Regle に移行する開発者向けスキルです。フォーム、ルール、状態、バインディングを順に扱い、ドキュメントに基づいて推測を避けます。
主な機能
- 01段階的な移行チェックリスト
- 02フォーム状態とルールの変換
- 03検証プロパティとバインディングの更新
- 04スコープ付き検証の移行案内
- 05カスタムルール前に組み込みルールを確認
活用シーン
- 01Vue フォームを Vuelidate から Regle へ移行
- 02スコープ付き検証を使う子コンポーネントの更新
MCP 対応
Regle MCP サーバーが利用可能な場合、API の詳細と移行案内を優先して参照します。
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/ / github.com/ victorgarciaesgi/ regle --skill regle-migrate-vuelidateインストール後、Claude Code で/regle-migrate-vuelidateを入力して読み込まれたか確認します。
同梱ファイルreferences/migration-steps.md
詳細
Vuelidate から Regle への移行
Vuelidate で構築されたフォームのバリデーションを Regle に変換します。すべてのフォーム、ルール、バリデーションプロパティを考慮してください。
ナレッジソース
API の詳細、パターン、TypeScript の型については、次の情報を優先順位の高い順に使用してください。
- Regle MCP サーバー(利用可能な場合):「Migrate from Vuelidate」やその他のトピックを検索します。有効になっていない場合は、ユーザーに有効化を依頼するか、自分で有効化してください。
- 関連する Regle スキル:
- regle —
useRegle、バリデーションプロパティ($error、$errors、$validate、$reset)、修飾子、エラーの表示。 - regle-rules — 組み込みルール、
createRule、ラッパー(withMessage)、演算子(requiredIf、applyIf、assignIf)。 - regle-advanced — スコープ付きバリデーション(
useScopedRegle、useCollectScope)、コレクション、非同期ルール、サーバーエラー、$self。 - regle-schemas — スキーマを使用するフォームのスキーマベースのバリデーション(Zod、Valibot、ArkType)。
- regle-typescript —
inferRules、ルールとプロパティの型付け(RegleRoot、InferRegleRoot、SuperCompatibleRegleRoot)。
- regle —
- ドキュメント/LLM 向けリファレンス:https://reglejs.dev/introduction/migrate-from-vuelidate、https://reglejs.dev/llms.txt(用語集)、https://reglejs.dev/llms-full.txt(ドキュメント全文)。
全般的なルール
- Regle では
$autoDirtyはデフォルトでtrueです。設定せず、手動の$touch()呼び出しは削除してください。 - コンポーザブルの結果の名前を変更する場合も、変数名は維持してください。Vuelidate の
v$(またはその他の名前)は、同じ識別子のr$になります。 - フォームの値は、Regle の
*.$valueプロパティにバインドしてください。 r$.$fields.xxxは使用せず、フィールドにはr$.xxxで直接アクセスしてください。- カスタムルールを作成する前に、同等の組み込みルールがないか確認してください。
- 特定のケースが不明な場合は、推測せずにユーザーに尋ねるか、変更せずにそのままにしてください。
ワークフロー
このチェックリストをコピーし、進捗を記録してください。
- [ ] 1. Identify the Vuelidate form
- [ ] 2. Replace the imports
- [ ] 3. Replace the state
- [ ] 4. Replace the validation rules
- [ ] 5. Replace the validation properties
- [ ] 6. Replace binding events
- [ ] 7. Replace nested-component validation (scoped)
- [ ] 8. Inspect form propagation (parent <-> child)
- [ ] 9. Self-review and run typecheck + lint
migration-steps の詳細な手順に従ってください。
コメント
Markdown 対応