リリース·  

Nuxt UI v4

Nuxt UI v4は、Nuxt UIとNuxt UI Proを1つの強力な、完全に無料のライブラリに統合します。110以上のコンポーネント、12のテンプレート、そして包括的なFigmaキットがすべて無料で利用できます。
Benjamin Canac

ベンジャミン・カナック

@benjamincanac

Sébastien Chopin

セバスチャン・ショパン

@atinux

Hugo Richard

ユーゴ・リシャール

@hugorcd__

本日、Nuxt UI v4をリリースします。これは、私たちのコンポーネントライブラリの新しい標準を確立する重要な節目です。このリリースにより、Nuxt UIとNuxt UI Proを、単一の強力で完全に無料のオープンソースライブラリに統合します。

これは、NuxtLabsがVercelに加わったことにより可能になった、VueとNuxtのエコシステムにとって刺激的な新しい章の始まりです。オープンソースコミュニティへの私たちの共通のコミットメントにより、シンプルなボタンから最も高度なダッシュボードのサイドバーまで、すべてのコンポーネントを誰でも利用できるようにすることができました。

これまでプレミアム提供だったものが、今ではすべての人に利用可能です。100以上のコンポーネント、高度なセクション、そして本番環境対応のテンプレートが、すべて一箇所に統合され、あなたのビルドに利用できます。

これまで以上に速く、何でも構築できます

Nuxt UI v4を使用すると、モダンで洗練されたアプリを素早く簡単に構築できます。ランディングページ、料金ページ、ドキュメント、ブログ、ポートフォリオなどの複雑なインターフェースをゼロから作成することなく構築できます。

これは、Nuxt UI v4が必要なすべてを単一の@nuxt/uiパッケージに統合しているため可能です

  • 110以上のコンポーネント： シンプルなウェブサイトから複雑なアプリケーションまで、あらゆるものを構築するための広範なライブラリ。
  • 12の無料テンプレート：ランディングページ, SaaS, ダッシュボード, ドキュメントサイト, ポートフォリオ, チャットアプリまたは変更履歴.
  • 用の本番環境対応テンプレートで、数分で次のプロジェクトを開始できます。豊富なコンテンツとタイポグラフィ： 高度なプロズコンポーネントを使用してMarkdownを美しくレンダリングし、コンテンツ豊富なサイトを構築できます。Nuxt Contentと完全に統合されています。
  • VueとNuxtの互換性： 任意のVueまたはNuxtプロジェクト、そしてAdonisGlobalComponentsLaravel.

でも動作します。Proスイート全体が今、あなたのものです。これまで有料ユーザー限定だった強力なコンポーネントを、今では誰でも無料で利用できます。

  <template>
    <UApp>
      <UHeader>
        <UNavigationMenu :items="navigation" />
        <template #right>
          <UColorModeButton />
          <UButton icon="i-simple-icons-github" />
        </template>
      </UHeader>

      <UPageHero
        title="Nuxt UI - Starter"
        description="Nuxt UI is a free and open-source UI library for Nuxt applications. Create beautiful & responsive applications in minutes."
        :links="heroLinks"
      />

      <UPageSection
        title="The freedom to build anything"
        description="Nuxt UI ships with a comprehensive set of components that cover a wide range of use-cases. Carefully crafted to reduce boilerplate code without sacrificing flexibility."
        :features="features"
      />

      <UPageSection title="Pricing">
        <UPricingPlans :plans="plans" />
      </UPageSection>

      <UPageSection>
        <UPageCTA
          title="Start with Nuxt UI today!"
          description="Nuxt UI is a free and open-source UI library for Nuxt applications."
          variant="subtle"
          :links="ctaLinks"
        />
      </UPageSection>

      <UFooter :items="footerItems" />
    </UApp>
  </template>

デザインからコードへ、シームレスに

成功するプロジェクトは、しっかりとしたデザインシステムから始まります。v4では、コンポーネントライブラリ全体を反映した完全なFigmaキットを無料でリリースします。

2,000以上のコンポーネントバリアントとデザインTトークンにより、構造と使用法に関する詳細な説明とともに、すべてのコンポーネントを含む単一のFigmaエントリーポイントが提供されます。デザイナーと開発者は同じ包括的なソースから作業することで、シームレスなコラボレーションを可能にし、デザインと実装の完璧な一致を保証します。

Figmaキットを入手 →

アップグレードされた開発者体験

新しいコンポーネント以外にも、v4はワークフローに大きな改善をもたらします。

簡単な移行

v2からv3への大幅な変更とは異なり、v4への移行は簡単です。このリリースは、破壊的な変更ではなく統合に焦点を当てています。ほとんどのコンポーネントは同じように機能し、既存のコードはほとんど変更されません。

詳細な手順については、当社の移行ガイドをご覧ください。

洗練されたドキュメント

ドキュメントを完全に刷新し、より明確で直感的にしました。レイアウトを再構築し、複雑なトピックを専用ページに分割することで、必要な情報をより迅速に見つけられるようにしました。

また、ドキュメントは完全にAI対応になりました。新しいModel Context Protocol (MCP)サーバーによって駆動され、CursorのようなAIツールがコンポーネントのドキュメントとメタデータに直接アクセスできるようになります。さらに、当社のコンポーネント、テーマ設定、ベストプラクティスを任意のAIアシスタントが理解できるようにする構造化フォーマットであるLLMs.txtファイルも提供しています。AIツールは、エディタ内で当社のライブラリ全体にファーストクラスでアクセスできるようになりました。

次世代のAIに備える

当社のAIチャットコンポーネントは、VercelのAI SDK v5をサポートするようになりました。新しいChatクラスとメッセージフォーマット（parts付き）は、最新のAI SDKの改善との互換性を確保し、AI開発の最前線にあなたを保ちます。

プロユーザーの皆様へ感謝の意

Nuxt UI Proをサポートしてくださったすべての皆様に心より感謝申し上げます。皆様の早期採用とフィードバックは、Nuxt UIを形作る上で不可欠でした。プロジェクトの資金調達、維持、改善にご協力いただき、コミュニティ全体にこれらの強力なツールを提供できるというこのマイルストーンに到達することができました。

皆様のサポートがこの瞬間を可能にしました。

今日から構築を始めましょう

無料テンプレートのいずれかを使用して新しいプロジェクトを作成し、Nuxt UI v4を始めましょう

npm create nuxt@latest -- -t ui

または既存のプロジェクトに追加する

npm install @nuxt/ui@latest

未来は開かれている

統一されたコードベースとVercelの支援により、コンポーネント開発の限界をこれまで以上に押し広げることに興奮しています。このリリースは、素晴らしいコミュニティのサポートと、Nuxt UIの形成に貢献してくれたすべての貢献者なしには不可能でした。

皆様が何を構築するか、楽しみにしています。UI開発の未来は無料で、オープンで、これまで以上に強力です。

始める準備はできましたか？ドキュメントをご覧ください。そして、Discordコミュニティに参加して、Nuxt UIで素晴らしいものを構築している他の開発者とつながりましょう。

← ブログに戻る
Nuxt on LinkedInBlueskyのNuxtNuxt on X