Hacktoberfest 2026：メンテナが10月に向けて印を付けた、オープンで初心者向けの issue。 Hacktoberfest の issue を見る

Loading bar: use <CwaLoadingIndicator> in app.vue (cwa-nuxt-module#396)

クローズ 初心者向け
  • 何か問題がありますか？
#234 コメント 0 件 リアクション 0 件 担当者 0 名 GitHub で見る

まだ誰も着手していません。

評価

難易度
2/5
見積もり時間
1〜3時間
初心者へのやさしさ
70/100
issue の種類
ドキュメント
明瞭さ
明確に書かれている
活発さ
活発
技術スタック
nuxtjs
領域
documentation, frontend

調査の方向性

app.vue とレイアウトの例でローディングバーを示しているドキュメントページから始めてください。CwaUiProgressBar が現れる箇所です。レイアウトの例は、<NuxtLayout> の上に配置した <CwaLoadingIndicator> に置き換えてください。このコンポーネントは <NuxtLoadingIndicator> をラップし、そのプロパティを受け付けることも記載してください。page:loading:end が発火するタイミングと definePageMeta({ cwa: { disabled: true } }) について、短い注記を追加してください。例と、プロパティおよびフックの注記が issue の本文と一致していれば完了です。

索引モデルが issue の本文から書いたものです。

説明

documentation

cwa-nuxt-module#396 (1ed92548, unreleased after 2.0.0-alpha.15).

  • <CwaLoadingIndicator> is the recommended loading bar: put it in app.vue above <NuxtLayout>. It wraps <NuxtLoadingIndicator> and takes its props (color, height, throttle, duration, …); on CWA pages it shows the real page load percentage.
  • CwaUiProgressBar in a layout is now optional; the template drops it.
  • Nuxt's page:loading:end (and so the loading bar finishing and the scroll to top) now waits for the new CWA page to show. Pages with definePageMeta({ cwa: { disabled: true } }) are never held. Anything an app hooks on page:loading:end runs when the new page is on screen.
主要言語
TypeScript
スター
0
フォーク
0
平均マージ
1時間 20分
マージ済み PR（30日）
1

環境構築

このプロジェクトには開発コンテナ、Dockerfile、コントリビューションガイドがありません。まず README を読み、一般的な手順ははじめてのコントリビューションガイドを参照してください。

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

components-web-app/docs のほかの issue

components-web-app/docs の issue をすべて見る

似ている issue

TypeScript の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。