docs(ja): add Japanese translations (#4969)

Author: Kenzo-Wada

docs/.vitepress/config.ts

@@ -52,6 +52,8 @@ export default defineConfig({
               return 'Скопировать код'
             case 'zh':
               return '复制代码'
+            case 'ja':
+              return 'コードをコピー'
             default:
               return 'Copy code'
           }
@@ -130,7 +132,8 @@ export default defineConfig({
     ru: { label: 'Русский', lang: 'ru-RU', dir: 'ltr' },
     es: { label: 'Español', lang: 'es', dir: 'ltr' },
     ko: { label: '한국어', lang: 'ko-KR', dir: 'ltr' },
-    fa: { label: 'فارسی', lang: 'fa-IR', dir: 'rtl' }
+    fa: { label: 'فارسی', lang: 'fa-IR', dir: 'rtl' },
+    ja: { label: '日本語', lang: 'ja', dir: 'ltr' }
   },
 
   vite: {

docs/ja/config.ts

@@ -0,0 +1,225 @@
+import { createRequire } from 'module'
+import { defineAdditionalConfig, type DefaultTheme } from 'vitepress'
+
+const require = createRequire(import.meta.url)
+const pkg = require('vitepress/package.json')
+
+export default defineAdditionalConfig({
+  description: 'Vite と Vue による静的サイトジェネレーター',
+
+  themeConfig: {
+    nav: nav(),
+
+    search: { options: searchOptions() },
+
+    sidebar: {
+      '/ja/guide/': { base: '/ja/guide/', items: sidebarGuide() },
+      '/ja/reference/': { base: '/ja/reference/', items: sidebarReference() }
+    },
+
+    editLink: {
+      pattern: 'https://github.com/vuejs/vitepress/edit/main/docs/:path',
+      text: 'GitHub でこのページを編集'
+    },
+
+    footer: {
+      message: 'MIT ライセンスの下で公開されています。',
+      copyright: 'Copyright © 2019-present Evan You'
+    }
+  }
+})
+
+function nav(): DefaultTheme.NavItem[] {
+  return [
+    {
+      text: 'ガイド',
+      link: '/ja/guide/what-is-vitepress',
+      activeMatch: '/guide/'
+    },
+    {
+      text: 'リファレンス',
+      link: '/ja/reference/site-config',
+      activeMatch: '/reference/'
+    },
+    {
+      text: pkg.version,
+      items: [
+        {
+          text: '1.6.4',
+          link: 'https://vuejs.github.io/vitepress/v1/'
+        },
+        {
+          text: '更新履歴',
+          link: 'https://github.com/vuejs/vitepress/blob/main/CHANGELOG.md'
+        },
+        {
+          text: 'コントリビュート方法',
+          link: 'https://github.com/vuejs/vitepress/blob/main/.github/contributing.md'
+        }
+      ]
+    }
+  ]
+}
+
+function sidebarGuide(): DefaultTheme.SidebarItem[] {
+  return [
+    {
+      text: '導入',
+      collapsed: false,
+      items: [
+        { text: 'VitePress とは？', link: 'what-is-vitepress' },
+        { text: 'はじめに', link: 'getting-started' },
+        { text: 'ルーティング', link: 'routing' },
+        { text: 'デプロイ', link: 'deploy' }
+      ]
+    },
+    {
+      text: '執筆',
+      collapsed: false,
+      items: [
+        { text: 'Markdown 拡張', link: 'markdown' },
+        { text: 'アセットの取り扱い', link: 'asset-handling' },
+        { text: 'フロントマター', link: 'frontmatter' },
+        { text: 'Markdown で Vue を使う', link: 'using-vue' },
+        { text: '多言語対応', link: 'i18n' }
+      ]
+    },
+    {
+      text: 'カスタマイズ',
+      collapsed: false,
+      items: [
+        { text: 'カスタムテーマを使う', link: 'custom-theme' },
+        {
+          text: 'デフォルトテーマの拡張',
+          link: 'extending-default-theme'
+        },
+        { text: 'ビルド時のデータ読み込み', link: 'data-loading' },
+        { text: 'SSR 互換性', link: 'ssr-compat' },
+        { text: 'CMS との接続', link: 'cms' }
+      ]
+    },
+    {
+      text: '実験的機能',
+      collapsed: false,
+      items: [
+        { text: 'MPA モード', link: 'mpa-mode' },
+        { text: 'サイトマップ生成', link: 'sitemap-generation' }
+      ]
+    },
+    {
+      text: '設定 & API リファレンス',
+      base: '/ja/reference/',
+      link: 'site-config'
+    }
+  ]
+}
+
+function sidebarReference(): DefaultTheme.SidebarItem[] {
+  return [
+    {
+      text: 'リファレンス',
+      items: [
+        { text: 'サイト設定', link: 'site-config' },
+        { text: 'Frontmatter 設定', link: 'frontmatter-config' },
+        { text: 'ランタイム API', link: 'runtime-api' },
+        { text: 'CLI', link: 'cli' },
+        {
+          text: 'デフォルトテーマ',
+          base: '/ja/reference/default-theme-',
+          items: [
+            { text: '概要', link: 'config' },
+            { text: 'ナビゲーション', link: 'nav' },
+            { text: 'サイドバー', link: 'sidebar' },
+            { text: 'ホームページ', link: 'home-page' },
+            { text: 'フッター', link: 'footer' },
+            { text: 'レイアウト', link: 'layout' },
+            { text: 'バッジ', link: 'badge' },
+            { text: 'チームページ', link: 'team-page' },
+            { text: '前 / 次 リンク', link: 'prev-next-links' },
+            { text: '編集リンク', link: 'edit-link' },
+            { text: '最終更新日時', link: 'last-updated' },
+            { text: '検索', link: 'search' },
+            { text: 'Carbon 広告', link: 'carbon-ads' }
+          ]
+        }
+      ]
+    }
+  ]
+}
+
+function searchOptions(): Partial<DefaultTheme.AlgoliaSearchOptions> {
+  return {
+    placeholder: 'ドキュメントを検索',
+    translations: {
+      button: {
+        buttonText: '検索',
+        buttonAriaLabel: '検索'
+      },
+      modal: {
+        searchBox: {
+          clearButtonTitle: '検索をクリア',
+          clearButtonAriaLabel: '検索をクリア',
+          closeButtonText: '閉じる',
+          closeButtonAriaLabel: '閉じる',
+          placeholderText: 'ドキュメントを検索',
+          placeholderTextAskAi: 'AI に質問: ',
+          placeholderTextAskAiStreaming: '回答を作成中...',
+          searchInputLabel: '検索',
+          backToKeywordSearchButtonText: 'キーワード検索に戻る',
+          backToKeywordSearchButtonAriaLabel: 'キーワード検索に戻る'
+        },
+        startScreen: {
+          recentSearchesTitle: '検索履歴',
+          noRecentSearchesText: '最近の検索はありません',
+          saveRecentSearchButtonTitle: '検索履歴に保存',
+          removeRecentSearchButtonTitle: '検索履歴から削除',
+          favoriteSearchesTitle: 'お気に入り',
+          removeFavoriteSearchButtonTitle: 'お気に入りから削除',
+          recentConversationsTitle: '最近の会話',
+          removeRecentConversationButtonTitle: '会話履歴から削除'
+        },
+        errorScreen: {
+          titleText: '結果を取得できません',
+          helpText: 'ネットワーク接続を確認してください'
+        },
+        noResultsScreen: {
+          noResultsText: '結果が見つかりません',
+          suggestedQueryText: '別の検索語を試してください',
+          reportMissingResultsText: '結果があるはずだと思いますか？',
+          reportMissingResultsLinkText: 'フィードバックを送る'
+        },
+        resultsScreen: {
+          askAiPlaceholder: 'AI に質問: '
+        },
+        askAiScreen: {
+          disclaimerText:
+            'AI が生成した回答には誤りが含まれる可能性があります。必ずご確認ください。',
+          relatedSourcesText: '関連ソース',
+          thinkingText: '考え中...',
+          copyButtonText: 'コピー',
+          copyButtonCopiedText: 'コピーしました！',
+          copyButtonTitle: 'コピー',
+          likeButtonTitle: 'いいね',
+          dislikeButtonTitle: 'よくない',
+          thanksForFeedbackText: 'フィードバックありがとうございます！',
+          preToolCallText: '検索中...',
+          duringToolCallText: '検索中 ',
+          afterToolCallText: '検索完了',
+          aggregatedToolCallText: '検索完了'
+        },
+        footer: {
+          selectText: '選択',
+          submitQuestionText: '質問を送信',
+          selectKeyAriaLabel: 'Enter キー',
+          navigateText: '移動',
+          navigateUpKeyAriaLabel: '上矢印キー',
+          navigateDownKeyAriaLabel: '下矢印キー',
+          closeText: '閉じる',
+          backToSearchText: '検索に戻る',
+          closeKeyAriaLabel: 'Esc キー',
+          poweredByText: '提供: '
+        }
+      }
+    }
+  }
+}

docs/ja/guide/asset-handling.md

@@ -0,0 +1,66 @@
+# アセットの取り扱い {#asset-handling}
+
+## 静的アセットの参照 {#referencing-static-assets}
+
+すべての Markdown ファイルは Vue コンポーネントにコンパイルされ、[Vite](https://vitejs.dev/guide/assets.html) によって処理されます。Markdown 内では、相対 URL を使ってアセットを参照することが **推奨されます**。
+
+```md
+![画像](./image.png)
+```
+
+Markdown ファイル内、テーマの `*.vue` コンポーネント内、スタイルや通常の `.css` ファイル内でも、アセットはプロジェクトルートを基準とした絶対パス、またはファイルシステムを基準とした相対パスで参照できます。後者は Vite、Vue CLI、あるいは webpack の `file-loader` を使ったことがある場合に慣れ親しんだ挙動です。
+
+一般的な画像、メディア、フォントファイルタイプは自動的にアセットとして検出され、含まれます。
+
+::: tip リンクされたファイルはアセットとして扱われません
+Markdown ファイル内のリンクで参照された PDF やその他のドキュメントは、自動的にアセットとして扱われません。これらのリンクファイルにアクセスできるようにするには、手動でプロジェクトの [`public`](#the-public-directory) ディレクトリに配置する必要があります。
+:::
+
+絶対パスを含むすべての参照されたアセットは、プロダクションビルド時にハッシュ化されたファイル名で出力ディレクトリにコピーされます。参照されないアセットはコピーされません。4kb 未満の画像アセットは base64 としてインライン化されます（これは [`vite`](../reference/site-config#vite) 設定オプションで変更可能です）。
+
+すべての **静的な** パス参照（絶対パスを含む）は、作業ディレクトリの構造を基準にする必要があります。
+
+## Public ディレクトリ {#the-public-directory}
+
+Markdown やテーマコンポーネントで直接参照されない静的アセットを提供する必要がある場合や、特定のファイルをオリジナルのファイル名のまま提供したい場合があります。  
+例えば `robots.txt`、favicon、PWA 用アイコンなどです。
+
+これらのファイルは [ソースディレクトリ](./routing#source-directory) 配下の `public` ディレクトリに配置できます。たとえばプロジェクトルートが `./docs` で、デフォルトのソースディレクトリを使用している場合、`public` ディレクトリは `./docs/public` になります。
+
+`public` に配置されたアセットは、出力ディレクトリのルートにそのままコピーされます。
+
+なお、`public` 内のファイルはルート絶対パスで参照する必要があります。例えば `public/icon.png` は常に `/icon.png` として参照しなければなりません。
+
+## ベース URL {#base-url}
+
+サイトをルート以外の URL にデプロイする場合、`.vitepress/config.js` で `base` オプションを設定する必要があります。  
+例えば `https://foo.github.io/bar/` にデプロイする場合、`base` は `'/bar/'` と設定します（必ずスラッシュで開始・終了する必要があります）。
+
+すべての静的アセットパスは `base` 設定値に応じて自動的に調整されます。  
+例えば Markdown 内で `public` 配下のアセットを絶対参照した場合：
+
+```md
+![画像](/image-inside-public.png)
+```
+
+この場合は `base` の設定値を変更しても、参照を修正する必要はありません。
+
+ただし、テーマコンポーネントで動的にアセットをリンクする場合（例：テーマ設定値に基づいた画像の `src`）は注意が必要です。
+
+```vue
+<img :src="theme.logoPath" />
+```
+
+この場合は、VitePress が提供する [`withBase` ヘルパー](../reference/runtime-api#withbase) でパスをラップすることを推奨します。
+
+```vue
+<script setup>
+import { withBase, useData } from 'vitepress'
+
+const { theme } = useData()
+</script>
+
+<template>
+  <img :src="withBase(theme.logoPath)" />
+</template>
+```

docs/ja/guide/cms.md

@@ -0,0 +1,56 @@
+---
+outline: deep
+---
+
+# CMS との接続 {#connecting-to-a-cms}
+
+## 全体のワークフロー {#general-workflow}
+
+VitePress を CMS と接続する際は、主に [動的ルーティング](./routing#dynamic-routes) を中心に考えることになります。先にその仕組みを理解しておいてください。
+
+CMS ごとに動作が異なるため、ここでは各自の環境に合わせて調整できる汎用的なワークフローのみを示します。
+
+1. CMS が認証を必要とする場合は、API トークンを格納するための `.env` を作成し、次のように読み込みます。
+
+    ```js
+    // posts/[id].paths.js
+    import { loadEnv } from 'vitepress'
+
+    const env = loadEnv('', process.cwd())
+    ```
+
+2. CMS から必要なデータを取得し、適切なパスデータの形式に整形します。
+
+    ```js
+    export default {
+      async paths() {
+        // 必要に応じて各 CMS のクライアントライブラリを使用
+        const data = await (await fetch('https://my-cms-api', {
+          headers: {
+            // 必要ならトークン
+          }
+        })).json()
+
+        return data.map(entry => {
+          return {
+            params: { id: entry.id, /* title, authors, date など */ },
+            content: entry.content
+          }
+        })
+      }
+    }
+    ```
+
+3. ページ内でコンテンツをレンダリングします。
+
+    ```md
+    # {{ $params.title }}
+
+    - {{ $params.date }} に {{ $params.author }} が作成
+
+    <!-- @content -->
+    ```
+
+## 連携ガイドの募集 {#integration-guides}
+
+特定の CMS と VitePress の連携ガイドを書かれた方は、下部の「Edit this page」リンクからぜひ投稿してください！