vue-router-best-practices
Vue Routerガードの信頼性を向上させる
Vue Routerのミスは、古いデータ、チェックの回避、リダイレクトループを引き起こす可能性があります。このスキルは、安全なガード、ルート更新、クリーンアップ、本番環境向けルーティングのための焦点を絞ったパターンを提供します。
自分のエージェントでインストール
このリクエストをエージェントにコピーしてください。正規の Skill ページとマニフェストが含まれています。
Review the Skillstore skill "vue-router-best-practices" from https://skillstore.io/skills/antfu-vue-router-best-practices.md and its manifest at https://skillstore.io/api/skills/antfu-vue-router-best-practices/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.エージェントは引き続き計画を提示し、セキュリティポリシーで必要な確認を求める必要があります。
エージェントが読めるリソース
AI エージェント、クローラー、スクリプトがページ全体ではなく整理されたコンテキストを必要とする場合は、これらのリンクを使ってください。
テストする
「vue-router-best-practices」を使用しています。 ルートがユーザープロフィールを保護するためにbeforeEnterを使用していますが、ユーザーは別のチェックなしにプロフィールIDを切り替えられます。
期待される結果:
このスキルは、same-routeのパラメータ変更ではbeforeEnterが実行されない理由を説明し、コンポーネント内の更新ガードを推奨します。
「vue-router-best-practices」を使用しています。 認証ガードが、すでにログインルートへ移動しようとしているユーザーも含め、すべての未認証ユーザーをログインルートへリダイレクトします。
期待される結果:
このスキルはリダイレクトループのリスクを特定し、公開ルートを除外すること、またはroute metaチェックを使用することを提案します。
「vue-router-best-practices」を使用しています。 小さなプロトタイプがhashchangeルーティングを使用しており、本番環境向けSPAになり始めています。
期待される結果:
このスキルは、シンプルなルーティングの制限と、ガード、ネストされたルート、遅延読み込みなどのVue Router機能を比較します。
セキュリティ監査
安全All 15 static findings are false positives from documented Vue Router examples. Fixed local imports, JavaScript template literals, route checks, and framework warnings do not create execution or reconnaissance risks. No prompt injection or malicious intent was found.
リスク要因
⚡ スクリプトを含む (6)
このレポートを共有・引用
バージョン付き評価レポート、中立的なバッジ、埋め込みカード、引用を共有できます。Skillstore は証拠を報告しますが、この Skill が安全かどうかは判断しません。
レポートリンクをコピー
https://skillstore.io/skills/antfu-vue-router-best-practices/audits/5?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_reportMarkdownバッジ
[](https://skillstore.io/skills/antfu-vue-router-best-practices?utm_source=security_passport_badge)HTMLバッジ
<a href="https://skillstore.io/skills/antfu-vue-router-best-practices?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/antfu-vue-router-best-practices/security.svg" alt="Skillstore security assessment" loading="lazy"></a>埋め込みカード
<iframe src="https://skillstore.io/embed/skills/antfu-vue-router-best-practices.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>学術引用 (APA · BibTeX · CFF)
APA形式の引用
github.com/vuejs-ai. (2026). vue-router-best-practices security audit report (audit version 5) [Author version 1.0.0]. Skillstore. https://skillstore.io/skills/antfu-vue-router-best-practices/audits/5BibTeX形式の引用
@techreport{github-com-vuejs-ai-antfu-vue-router-best-practices-2026,
author = {github.com/vuejs-ai},
title = {vue-router-best-practices security audit report (audit version 5)},
institution = {Skillstore},
year = {2026},
number = {5},
url = {https://skillstore.io/skills/antfu-vue-router-best-practices/audits/5},
note = {Author version 1.0.0}
}CITATION.cff
cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "vue-router-best-practices security audit report (audit version 5)"
version: "1.0.0"
type: report
authors:
- name: "github.com/vuejs-ai"
date-released: "2026-07-23"
url: "https://skillstore.io/skills/antfu-vue-router-best-practices/audits/5"
identifiers:
- type: other
value: "skillstore:antfu-vue-router-best-practices:audit:5"
description: "Skillstore immutable audit report identifier"
バリアントを比較
インストール可能なバリアント 2 件各作者のスキルは個別のインストール項目として維持されます。推奨バリアントは Skillstore の証拠で順位付けされます。
このバリアントが首位の理由
antfu-vue-router-best-practices
2026-09-09
vuejs-ai-vue-router-best-practices
2026-09-09
Skillstore スコア
このスコアの理由 証拠の信頼度: 高作成できるもの
ガード回避バグを修正する
パラメータやクエリの変更によって期待されるbeforeEnterチェックがスキップされる可能性のあるルートをレビューします。
認証ナビゲーションを安定化する
非同期チェック、リダイレクト、エラーハンドリングを行う認証ガードを改善します。
SPAルーティングを準備する
シンプルなhashルーティングから、保守しやすいVue Routerの本番環境向けセットアップへ移行します。
これらのプロンプトを試す
Review my Vue Router guard for common mistakes. Focus on redirects, async behavior, and route param changes.
Help me update a Vue component that keeps stale data when the route param changes. Explain the best pattern to use.
Design a Vue Router auth flow with public routes, protected routes, redirect queries, timeout handling, and loop prevention.
Audit this Vue Router setup for production readiness. Cover lazy loading, route meta, lifecycle handling, cleanup, and navigation failure cases.
ベストプラクティス
- ルートパラメータが表示データを決定する場合は、コンポーネント内の更新ガードまたはwatcherを使用します。
- 非同期ナビゲーションチェックをawaitし、明示的なリダイレクトまたは続行結果を返します。
- リダイレクトループを防ぐために、route metaフィールドと公開ルートセットを使用します。
回避
- same-routeのパラメータまたはクエリの変更にbeforeEnterを頼ること。
- 結果を待たずに非同期認証チェックを開始すること。
- ナビゲーションがすでにそこにいるかどうかを確認せずに、ガード付きルートへリダイレクトすること。
よくある質問
このスキルはどのVue Routerバージョンを対象にしていますか？
認証ガードに役立ちますか？
ルートパラメータの更新を扱いますか？
Vue Routerドキュメントを置き換えられますか？
このスキルは小さなプロトタイプに役立ちますか？
コードを実行したり、プロジェクトを直接変更したりしますか？
開発者情報
ライセンス
MIT
作者バージョン
v1.0.0
Skillstore リビジョン
r2
参照
89edfdc710d0846129dcee6a929477b04f08052c
メンテナンスの新しさ
2026/7/24
利用状況
15 ダウンロード · 148 閲覧
ファイル構成
📄 router-beforeenter-no-param-trigger.md
📄 router-beforerouteenter-no-this.md
📄 router-guard-async-await-pattern.md
📄 router-navigation-guard-infinite-loop.md
📄 router-navigation-guard-next-deprecated.md
📄 router-param-change-no-lifecycle.md
📄 router-simple-routing-cleanup.md
📄 router-use-vue-router-for-production.md
📄 SKILL.md
📄 SYNC.md