Nuxt UI 比較

単なる機能表ではなく、公式 Nuxt UI docs テンプレートを基に構築した日英対応サイトです。

評価項目を見る

実践評価を読む

nuxt.config.ts

export default defineNuxtConfig({
  modules: [
    '@nuxt/ui',
    '@nuxt/content'
  ],

  app: {
    baseURL: '/docfw-cmp/nuxt-ui/'
  }
})

Nuxt UI コンポーネントで構築

日本語と英語

対応するパスを保ったまま切り替えられる、執筆済みの2つの言語ツリーです。

組み込みローカル検索

Nuxt UI ContentSearch が生成済みコンテンツを使い、外部の検索サービスを必要としません。

ライト・ダーク表示

独自テーマエンジンを追加せず、標準の外観コントロールで両方を確認できます。

豊富な本文コンポーネント

カード、コールアウト、タブ、コードブロック、デモを実際の評価ページで使っています。

スマートなナビゲーション

サイドバー、前後リンク、目次がコンテンツファイルと同期して自動生成されます。

アクセシブルな UI

キーボード操作とレスポンシブ表示に対応した部品が Nuxt UI から提供されます。

すべての評価項目を見る

静的配信

専用のベースパス以下へ、静的ホスティング向けのディレクトリ形式 HTML を生成します。

15の評価項目

各機能を専用ページに分け、動作する例と実装メモを掲載しています。

実践評価

このサイトの構築結果を基に、日付付きの事実とプロジェクトの所感を分けてまとめています。

ローカルで再現可能

インストール、開発、プロダクションビルドのコマンドを短いガイドに集約しています。

ファイルベースルーティング

並列のコンテンツフォルダが、予測しやすい日本語・英語の URL になります。

リポジトリで管理

ページ、コンポーネント、設定、ビルドの根拠をすべてプロジェクトのソースと一緒に管理します。

実践評価を読む

動作する評価項目から実践的な結論へ進み、最後に同じビルドをローカルで再現できます。