mirror of
https://github.com/nuxt/nuxt.git
synced 2024-11-26 23:52:06 +00:00
80 lines
3.2 KiB
Markdown
80 lines
3.2 KiB
Markdown
# Introduction
|
||
|
||
Getting started with Nuxt 3 is straightforward.
|
||
|
||
::alert{type=warning icon=🚧}
|
||
Nuxt 3 is currently in beta, keep in mind that **it is not yet production-ready**.<br>
|
||
Thank you in advance for your understanding 💛
|
||
::
|
||
|
||
## What is Nuxt?
|
||
|
||
If this is the first time you're learning about Nuxt or you want to get more familiar with Nuxt 3, we recommend you begin by reading the [Concepts section](/concepts).
|
||
|
||
## Prerequisites
|
||
|
||
Before getting started, please make sure you have installed the recommended setup.
|
||
|
||
* **Node.js**<sup>*</sup> (latest LTS version) 👉 [[Download](https://nodejs.org/en/download/)]
|
||
* **Visual Studio Code** 👉 [[Download](https://code.visualstudio.com/)]
|
||
* **Volar Extension** 👉 [[Download](https://marketplace.visualstudio.com/items?itemName=johnsoncodehk.volar)]
|
||
|
||
<sup>*</sup> If you already have Node.js installed, check with `node --version` that you are using `v14` or `v16`.
|
||
|
||
## Nuxt 3 or Bridge?
|
||
|
||
Next, decide whether to start from scratch or upgrade an existing Nuxt 2 project.
|
||
|
||
### Starting a fresh Nuxt project
|
||
|
||
::list{type=info}
|
||
|
||
* Enjoy using Vue 3
|
||
* All the new composables are available
|
||
* New templating system and conventions are enabled
|
||
::
|
||
|
||
::alert{icon=👉}
|
||
Checkout the [Installation section](/getting-started/installation).
|
||
::
|
||
|
||
### Migrating a Nuxt 2 project
|
||
|
||
If you have an existing Nuxt 2 project, we **strongly recommend** you begin by using Nuxt Bridge. This way you can try most new features while keeping breaking changes to a minimum.
|
||
|
||
::list{type=info}
|
||
|
||
* It's risk-free! You can always remove the module from your config
|
||
* Makes your project (almost) ready for Nuxt 3
|
||
* Enjoy new DX improvements without major rewrites for Vue 3
|
||
* Use Nitro engine for platform-agnostic and optimized deployments
|
||
* Help us stabilize Nuxt 3 and discover flaws
|
||
* Nuxt Bridge is more stable than Nuxt 3 at the moment
|
||
::
|
||
|
||
::alert{icon=👉}
|
||
Checkout the [Bridge installation section](/getting-started/bridge).
|
||
::
|
||
|
||
### Comparison
|
||
|
||
In the table below, there is a quick comparison between 3 versions of Nuxt:
|
||
|
||
Feature / Version | Nuxt 2 | Nuxt Bridge | Nuxt 3
|
||
-------------------------|-----------------|------------------|---------
|
||
Vue | 2 | 2 | 3
|
||
Stability | 😊 Stable | 😌 Semi-stable | 😬 Unstable
|
||
Performance | 🏎 Fast | ✈️ Faster | 🚀 Fastest
|
||
Nitro Engine | ❌ | ✅ | ✅
|
||
ESM support | 🌙 Partial | 👍 Better | ✅
|
||
TypeScript | ☑️ Opt-in | 🚧 Partial | ✅
|
||
Composition API | ❌ | 🚧 Partial | ✅
|
||
Options API | ✅ | ✅ | ✅
|
||
Components Auto Import | ✅ | ✅ | ✅
|
||
`<script setup>` syntax | ❌ | 🚧 Partial | ✅
|
||
Auto Imports | ❌ | ✅ | ✅
|
||
Webpack | 4 | 4 | 5
|
||
Vite | ⚠️ Partial | 🚧 Partial | 🚧 Experimental
|
||
Nuxi CLI | ❌ Old | ✅ nuxi | ✅ nuxi
|
||
Static sites | ✅ | ✅ | 🚧
|