docs: move prerequisites into a summary

nuxt · Mar 9, 2023 · e0cb950 · e0cb950
1 parent 9036142
commit e0cb950
Showing 1 changed file with 20 additions and 25 deletions.
diff --git a/docs/1.getting-started/2.installation.md b/docs/1.getting-started/2.installation.md
@@ -17,34 +17,29 @@ Start with one of our starters and themes directly by opening [nuxt.new](https:/
 
 :button-link[Discover nuxt.new]{href="https://nuxt.new" blank}
 
-## 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=Vue.volar)]
-  * Either enable [**Take Over Mode**](https://vuejs.org/guide/typescript/overview.html#volar-takeover-mode) (recommended)
-  * ... or add **TypeScript Vue Plugin (Volar)** 👉 [[Download](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin)]
-
-<sup>*</sup> If you already have Node.js installed, check with `node --version` above 16.11.
-
-::alert{type=info}
-
-If you have enabled **Take Over Mode** or installed the **TypeScript Vue Plugin (Volar)**, you can disable generating the shim for `*.vue` files in your `nuxt.config` file:
-
-```js
-export default defineNuxtConfig({
-  typescript: {
-    shim: false
-  }
-})
-```
+## New Project
 
+::alert
+  ::details
+    :summary[Before getting started, please make sure you have installed the recommended setup:]
+    * **Node.js**<sup>*</sup> (latest LTS version or above 16.11) 👉 [[Download](https://nodejs.org/en/download/)]
+    * **Visual Studio Code** 👉 [[Download](https://code.visualstudio.com/)]
+    * **Volar Extension** 👉 [[Download](https://marketplace.visualstudio.com/items?itemName=Vue.volar)]
+      * Either enable [**Take Over Mode**](https://vuejs.org/guide/typescript/overview.html#volar-takeover-mode) (recommended)
+      * ... or add **TypeScript Vue Plugin (Volar)** 👉 [[Download](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin)]
+
+    If you have enabled **Take Over Mode** or installed the **TypeScript Vue Plugin (Volar)**, you can disable generating the shim for `*.vue` files in your `nuxt.config` file:
+
+    ```ts [nuxt.config.ts]
+    export default defineNuxtConfig({
+      typescript: {
+        shim: false
+      }
+    })
+    ```
+  ::
 ::
 
-## New Project
-
 Open a terminal (if you're using [Visual Studio Code](https://code.visualstudio.com/), you can open an [integrated terminal](https://code.visualstudio.com/docs/editor/integrated-terminal)) and use the following command to create a new starter project:
 
 ::code-group