NuxtJS V3のロードマップと情報の整理

はじめに

相当楽しみです!

NuxtJS バージョン3のロードマップ的なものが公表されていたので共有します。
リリースは、2021年のQ1にアルファ版、Q2にベータ版その後、安定板のリリースといった形が想定されているようです。詳細は下記をよく読んでください。

まだ、NuxtユーザーでDiscordサーバに入っていなかったり、その他諸々キャッチアップできていない人はまずフォローから始めましょう。

これからNuxtJSを始める初心者の方は、

このあたりをよく読み、バージョンアップに備えましょう。
また、NuxtJS Teamの方々のアカウントなどもフォローしておくと、最新の情報をキャッチアップできます。

以下、バージョン3での対応内容ですが、気になった箇所を太字にしています。

Nuxt v3 - Internal changes

  • Webpack 5 and Vite support
  • PostCSS 8
  • ESBuild
  • Rewritten in TypeScript
  • vue-bundle-renderer for Vue 3
  • Modules utils
  • New rendering engine: Nitro (see Daniel Roe talk)
  • See Pooya Parsa talk for more details

app.vue - The entry point of your Nuxt app

  • Optional if using pages/ directory
  • Perfect for global data fetching
  • Great for landing pages or app without router
  • Produces 20.68KB gzipped JS

Routing - A powerful routing system based on Vue Router 4

  • pages/_slug.vue becomes pages/[slug].vue
  • Catch sub paths with pages/blog/[...all].vue
  • Support pages/404.vue and pages/_error.vue
  • Ignore prefix is now underscore: pages/_ignored.vue
  • Add routes at runtime with plugins
  • and become

Data Fetching - How to fetch data with Nuxt 3

  • Brainstormed with Evan You
  • Based on the composition API
  • Can pause the page navigation until fetched
  • Support server-side rendering and hydration
  • Works at the component level == everywhere
  • Will support caching (SWR like)
    Support custom data fetcher

More - What are the other changes

  • Auto import of plugins
  • static/ becomes public/
  • app.html becomes document.html
  • Hooks on the app side: app:created, page:finish, etc.
  • Support for multi apps (theming)
  • New functions/ directory for server-only execution
  • First class Serverless support

その他